{#
This file is part of EC-CUBE
Copyright(c) LOCKON CO.,LTD. All Rights Reserved.
http://www.lockon.co.jp/
For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.
#}
{% extends 'default_frame.twig' %}
{% set body_class = 'registration_page' %}
{% form_theme form 'Form/form_div_layout.twig' %}
{% block javascript %}
<script src="//yubinbango.github.io/yubinbango/yubinbango.js" charset="UTF-8"></script>
{% endblock javascript %}
{% block main %}
<section class="p-entry">
<div class="p-entry__heading">
<h1 class="c-page-title">
<span class="c-page-title__text">{{ '新規会員登録'|trans }}</span>
</h1>
</div>
<div class="p-entry__contents">
<form method="post" action="{{ url('entry') }}" novalidate class="h-adr">
<span class="p-country-name" style="display:none;">Japan</span>
{{ form_widget(form._token) }}
<div class="c-form is-input">
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.name, 'お名前', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.name.name01) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.name.name01, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_name_name01">姓</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.name.name01, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.name.name02) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.name.name02, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_name_name02">名</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.name.name02, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.kana, 'お名前(カナ)', {'label_attr': {'class': 'c-form__parts-label-text'}}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.kana.kana01) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.kana.kana01, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_kana_kana01">セイ</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.kana.kana01, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.kana.kana02) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.kana.kana02, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_kana_kana02">メイ</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.kana.kana02, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.company_name, '会社名', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.company_name) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.company_name, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.company_name, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.address, '住所', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-form__postcode">
<div class="c-form__postcode-item">
<span class="c-form__postcode-mark">{{ '〒'|trans }}</span>
<div class="c-form__postcode-input">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.postal_code) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.postal_code, {'attr': { 'class': 'c-text-field__input mdc-text-field__input p-postal-code', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_postal_code">例:5530003</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.postal_code, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
<div class="c-form__postcode-item">
<a class="c-button mdc-button" href="http://www.post.japanpost.jp/zipcode/" target="_blank" rel="noopener">
<i class="c-button__icon mdc-button__icon material-icons">help</i>
<span class="c-button__label mdc-button__label">{{ '郵便番号検索'|trans }}</span>
</a>
</div>
</div>
</div>
</div>
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-select mdc-select mdc-select--outlined{{ has_errors(form.address.pref) ? ' mdc-select--invalid' }}">
<i class="mdc-select__dropdown-icon"></i>
{{ form_widget(form.address.pref, {'attr': { 'class': 'c-select__native-control mdc-select__native-control p-region-id' }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.address.pref, {'label_attr': {'class': 'mdc-select-helper-text mdc-select-helper-text--validation-msg'}}) }}
</div>
</div>
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.address.addr01) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.address.addr01, {'attr': { 'class': 'c-text-field__input mdc-text-field__input p-locality p-street-address', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_address_addr01">市区町村名(例:大阪市福島区)</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.address.addr01, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.address.addr02) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.address.addr02, {'attr': { 'class': 'c-text-field__input mdc-text-field__input p-extended-address', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_address_addr02">番地・ビル名(例:福島8丁目3-15)</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.address.addr02, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.phone_number, '電話番号', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item is-half">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.phone_number) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.phone_number, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_phone_number">例:11122223333</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.phone_number, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.email, 'メールアドレス', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.email.first) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.email.first, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_email_first">example@example.com</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.email.first, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.email.second) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.email.second, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_email_second"><span class="u-break--sp-hidden">確認のため</span>もう一度入力してください</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.email.second, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.password is defined ? form.password : form.plain_password, 'パスワード', { 'label_attr': {'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item is-half">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.password.first is defined ? form.password.first : form.plain_password.first) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.password.first is defined ? form.password.first : form.plain_password.first, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }, 'type': 'password'}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_password_first">半角英数記号{{ eccube_config.eccube_password_min_len }}〜{{ eccube_config.eccube_password_max_len }}文字</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.password.first is defined ? form.password.first : form.plain_password.first, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
<div class="c-form__box">
<div class="c-form__box-item is-half">
<div class="c-text-field mdc-text-field mdc-text-field--outlined{{ has_errors(form.password.second is defined ? form.password.second : form.plain_password.second) ? ' mdc-text-field--invalid' }}">
{{ form_widget(form.password.second is defined ? form.password.second : form.plain_password.second, {'attr': { 'class': 'c-text-field__input mdc-text-field__input', 'placeholder': null }, 'type': 'password'}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch">
<label class="c-floating-label mdc-floating-label" for="entry_password_second"><span class="u-break--sp-hidden">確認のため</span>もう一度入力してください</label>
</div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.password.second is defined ? form.password.second : form.plain_password.second, {'label_attr': {'class': 'mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.birth, '生年月日', { 'label_attr': {'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-form__birth">
<div class="c-form__birth-item is-birth-year">
<div class="c-select mdc-select mdc-select--outlined{{ has_errors(form.birth) ? ' mdc-select--invalid' }}">
<i class="mdc-select__dropdown-icon"></i>
{{ form_widget(form.birth.year, {'attr': { 'class': 'c-select__native-control mdc-select__native-control' }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
</div>
<div class="c-form__birth-item">
<span class="c-form__birth-slash">/</span>
</div>
<div class="c-form__birth-item">
<div class="c-select mdc-select mdc-select--outlined{{ has_errors(form.birth) ? ' mdc-select--invalid' }}">
<i class="mdc-select__dropdown-icon"></i>
{{ form_widget(form.birth.month, {'attr': { 'class': 'c-select__native-control mdc-select__native-control' }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
</div>
<div class="c-form__birth-item">
<span class="c-form__birth-slash">/</span>
</div>
<div class="c-form__birth-item">
<div class="c-select mdc-select mdc-select--outlined{{ has_errors(form.birth) ? ' mdc-select--invalid' }}">
<i class="mdc-select__dropdown-icon"></i>
{{ form_widget(form.birth.day, {'attr': { 'class': 'c-select__native-control mdc-select__native-control' }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
</div>
</div>
{{ form_errors(form.birth, {'label_attr': {'class': 'c-form__error-text'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label is-radio">
{{ form_label(form.sex, '性別', { 'label_attr': { 'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
{{ form_widget(form.sex, { 'attr': { 'class': 'c-form__radios' }}) }}
{{ form_errors(form.sex, {'label_attr': {'class': 'c-form__error-text'}}) }}
</div>
</div>
</dd>
</dl>
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(form.job, '職業', { 'label_attr': {'class': 'c-form__parts-label-text' }}) }}
</dt>
<dd class="c-form__parts-detail">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="c-select mdc-select mdc-select--outlined{{ has_errors(form.job) ? ' mdc-select--invalid' }}">
<i class="mdc-select__dropdown-icon"></i>
{{ form_widget(form.job, {'attr': { 'class': 'c-select__native-control mdc-select__native-control' }}) }}
<div class="mdc-notched-outline">
<div class="mdc-notched-outline__leading"></div>
<div class="mdc-notched-outline__notch"></div>
<div class="mdc-notched-outline__trailing"></div>
</div>
</div>
{{ form_errors(form.job, {'label_attr': {'class': 'mdc-select-helper-text mdc-select-helper-text--validation-msg'}}) }}
</div>
</div>
</dd>
</dl>
{# エンティティ拡張の自動出力 #}
{% for f in form if f.vars.eccube_form_options.auto_render %}
{% if f.vars.eccube_form_options.form_theme %}
{% form_theme f f.vars.eccube_form_options.form_theme %}
{{ form_row(f) }}
{% else %}
<dl class="c-form__parts u-dl-sanitize">
<dt class="c-form__parts-label">
{{ form_label(f) }}
</dt>
<dd class="c-form__parts-detail">
<div class="{{ f.vars.eccube_form_options.style_class }}{{ has_errors(f) ? ' error' }}">
{{ form_widget(f) }}
{{ form_errors(f) }}
</div>
</dd>
</dl>
{% endif %}
{% endfor %}
<div class="c-form__agree">
<div class="c-form__box">
<div class="c-form__box-item">
<div class="mdc-form-field">
{{ form_widget(form.user_policy_check) }}
<label for="entry_user_policy_check">{{ '<a href="%url%" target="_blank" rel="noopener">利用規約</a>に同意してお進みください'|trans({ '%url%': url('help_agreement') })|raw }}</label>
</div>
{{ form_errors(form.user_policy_check, {'label_attr': { 'class': 'c-form__error-text' }}) }}
</div>
</div>
</div>
<div class="c-form__actions">
<div class="c-form__actions-item">
<button class="c-form__button c-button is-secondary c-button--unelevated mdc-button mdc-button--unelevated" type="submit" name="mode" value="confirm">
<span class="c-button__label mdc-button__label">{{ '登録する'|trans }}</span>
</button>
</div>
<div class="c-form__actions-item">
<a class="c-form__button c-button is-primary c-button--unelevated mdc-button mdc-button--unelevated" href="{{ url('homepage') }}">
<span class="c-button__label mdc-button__label">{{ '同意しない'|trans }}</span>
</a>
</div>
</div>
</div>
</form>
</div>
</section>
{% endblock %}