{% extends 'default_frame.twig' %}
{% form_theme form 'Form/form_div_layout.twig' %}
{% block stylesheet %}
<style type="text/css">
.horizontal{
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}
.address .error-empty{
position: relative!important;
top: unset!important;
}
.horizontal .form-check{
padding-left: 0;
margin-right: 2rem;
}
.ec-form-inquiry__group .table table tr td:nth-child(2) .fill.horizontal label input{
margin-left: 0;
}
.ec-form-inquiry__group .table table tr td:nth-child(2) .fill.horizontal label input[type="text"]{
max-width: 100px;
}
.ec-form-inquiry__group .table table tr td:nth-child(2) .fill.horizontal label span{
margin-right: 2rem;
}
/*.ec-form-inquiry__group .step-content {
display: block; /*Debug*/
}*/
</style>
{% endblock stylesheet %}
{% block javascript %}
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>
<script type="text/javascript">
$(function() {
$('.postal_code').click(function(event) {
AjaxZip3.zip2addr('loan[postal_code]', '', 'loan[address][pref]', 'loan[address][addr01]');
return false;
});
$('.employed_postal_code').click(function(event) {
AjaxZip3.zip2addr('loan[employed_postal_code]', '', 'loan[employed_address_pref]', 'loan[employed_address_addr01]');
return false;
});
$('.guarantor_postal_code').click(function(event) {
AjaxZip3.zip2addr('loan[guarantor_postal_code]', '', 'loan[guarantor_address_pref]', 'loan[guarantor_address_addr01]');
return false;
});
$('.guarantor_company_postal_code').click(function(event) {
AjaxZip3.zip2addr('loan[guarantor_company_postal_code]', '', 'loan[guarantor_company_address_pref]', 'loan[guarantor_company_address_addr01]');
return false;
});
})
</script>
<script>
$(document).ready(function() {
$('form, input, select').attr('autocomplete', "off");
$('input[name="loan[spouse]"]').change(function() {
var selectedValue = $('input[name="loan[spouse]"]:checked').val();
if (selectedValue == "有り") {
$('select[name="loan[spouse_job]"]').attr('required', 'required');
}
else {
$('select[name="loan[spouse_job]"]').removeAttr('required');
$('select[name="loan[spouse_job]"]').closest('td').find('.error-empty').remove();
}
});
$('input[name="loan[household_paying]"]').change(function() {
var selectedValue = $('input[name="loan[household_paying]"]:checked').val();
if (selectedValue == "有り") {
$('input[name="loan[household_paying_amount]"]').attr('required', 'required');
}
else {
$('input[name="loan[household_paying_amount]"]').removeAttr('required');
$('input[name="loan[household_paying_amount]"]').closest('td').find('.error-empty').remove();
}
});
//Chỉ check phần trên hoặc phần dưới của お勤め先・ご収入について
$('#employed input, #employed select, #employed textarea').change(function(event) {
$('#pensioner td').find('.error-empty').remove();
});
$('#pensioner input, #pensioner select, #pensioner textarea').change(function(event) {
$('#employed td').find('.error-empty').remove();
});
var step_number = Number($('.ec-form-inquiry__group__step__item.active').data('step'));
$('#btn-back').click(function(event) {
$("span.error-empty").remove();
if (step_number > 1) {
step_number--;
stepActive(step_number);
}
$('body,html').animate({
scrollTop: 250
}, 300, 'swing');
});
$("#btn-confirm").click(function(event) {
$("span.error-empty").remove();
var employed_has_error = false;
var pensioner_has_error = false;
var has_error = false;
if (step_number == 2) {
// お勤め先・ご収入について chi check 1 phan
$('#employed select[required], #employed input[required], #employed textarea[required]').each(function() {
var input = $(this);
if (input.attr('type') == 'radio' || input.attr('type') == 'checkbox') {
var radio_name = input.attr('name');
if ($('input[name="' + radio_name + '"]:checked').length == 0) {
employed_has_error = true;
}
}
else if (input.val() == ""){
employed_has_error = true;
}
});
$('#pensioner select[required], #pensioner input[required], #pensioner textarea[required]').each(function() {
var input = $(this);
if (input.attr('type') == 'radio' || input.attr('type') == 'checkbox') {
var radio_name = input.attr('name');
if ($('input[name="' + radio_name + '"]:checked').length == 0) {
pensioner_has_error = true;
}
}
else if (input.val() == ""){
pensioner_has_error = true;
}
});
}
if (step_number != 2 || (employed_has_error == true && pensioner_has_error == true)) {
$('.step-content.step-' + step_number + ' .table select[required], .step-content.step-' + step_number + ' .table input[required], .step-content.step-' + step_number + ' .table textarea[required]').each(function() {
var input = $(this);
var input_empty = $("<span>").addClass("error-empty").text("※この項目は必須項目です");
if (input.attr('type') == 'radio' || input.attr('type') == 'checkbox') {
var radio_name = input.attr('name');
if ($('input[name="' + radio_name + '"]:checked').length == 0) {
input.before(input_empty);
has_error = true;
}
}
else if (input.attr('type') == 'email' && validateEmail(input.val()) === false) {
input.before($("<span>").addClass("error-empty").text("※正しくメールアドレスを入力してください"));
}
else if (input.val() == ""){
input.before(input_empty);
has_error = true;
}
else {
input_empty.remove();
}
input.on("change", function() {
if (input.attr('type') == 'radio' || input.attr('type') == 'checkbox') {
input.closest('td').find('.error-empty').remove();
}
else {
input_empty.remove();
}
});
});
}
if (has_error) {
var position = $(".error-empty").eq(0).offset().top - 250;
$('body,html').animate({
scrollTop: position
}, 300, 'swing');
return false;
}
// chi xu ly tab, khong submit form
if (step_number != 4) {
step_number++;
stepActive(step_number);
$('body,html').animate({
scrollTop: 250
}, 300, 'swing');
return false;
}
if (employed_has_error == false) {
$('#pensioner select[required], #pensioner input[required], #pensioner textarea[required]').removeAttr('required');
}
if (pensioner_has_error == false) {
$('#employed select[required], #employed input[required], #employed textarea[required]').removeAttr('required');
}
});
});
/**
* Xu ly Tab
*/
function stepActive(step_number) {
$('.ec-form-inquiry__group__step__item').removeClass('active');
$('.step-content').removeClass('active');
$('.ec-form-inquiry__group__step__item.step-' + step_number).addClass('active');
$('.step-content.step-' + step_number).addClass('active');
if (step_number > 1) {
$('#btn-back').addClass('active');
}
else {
$('#btn-back').removeClass('active');
}
}
/**
* Check mail
*/
function validateEmail(email) {
var re = /\S+@\S+\.\S+/;
return re.test(email);
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
<script>
var CountTatami = {
countType1: 0, //6-14
countType2: 0, //16-20
countType3: 0, //23-
};
var CountTatamiAll = {
countType1: 0, //6-14
countType2: 0, //16-20
countType3: 0, //23-
};
var CountTatamiLoan = {
countType1: 0, //6-14
countType2: 0, //16-20
countType3: 0, //23-
};
$(function() {
//khi load page, nếu không chọn thì check tất cả product
if ($('.construction_air:checked').length <= 0) {
$('.construction_air').prop('checked', true);
}
SetRequiredContent();
SetRequiredContent1();
SetRequiredContent2("construction_type_07", "交換", ".construction_type_07_02_v1");
SetRequiredContent2("construction_type_07", "新設工事に加えて移設工事も希望", ".construction_type_07_02_v2");
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望する", ".construction_type_07_03_v1");
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望しない", ".construction_type_07_03_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設6~14畳(取外し含む)", ".construction_type_07_04_v1");
SetRequiredContent2("construction_type_07_03_v1", "移設16~20畳(取外し含む)", ".construction_type_07_04_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設23畳~(取外し含む)", ".construction_type_07_04_v3");
SetRequiredContent2("electrical_outlet_07", "あり", ".electrical_outlet_07_02");
SetRequiredContent2("room_size_07", "なし", ".room_size_07_02");
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書あり", ".room_size_07_03_v1");
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書なし", ".room_size_07_03_v2");
SetRequiredContent2("piping_status_07", "隠蔽配管", ".piping_status_07_02");
SetRequiredContent2("outdoor_cover", "必要", ".outdoor_cover_02");
SetRequiredContent2("setting_install_method", "新規取付", ".construction_method_07_v1");
SetRequiredContent2("setting_install_method", "交換", ".construction_method_07_v2");
$("input[name='loan[desired_construction_work]']").change(function() {
SetRequiredContent();
});
$("input[name='loan[desired_construction_work_02]']").change(function() {
SetRequiredContent1();
CalcConstructionNumber();
});
$("input[name='loan[construction_type_07]']").change(function() {
SetRequiredContent2("construction_type_07", "交換", ".construction_type_07_02_v1");
SetRequiredContent2("construction_type_07", "新設工事に加えて移設工事も希望", ".construction_type_07_02_v2");
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望する", ".construction_type_07_03_v1");
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望しない", ".construction_type_07_03_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設6~14畳(取外し含む)", ".construction_type_07_04_v1");
SetRequiredContent2("construction_type_07_03_v1", "移設16~20畳(取外し含む)", ".construction_type_07_04_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設23畳~(取外し含む)", ".construction_type_07_04_v3");
});
$("input[name='loan[construction_type_07_02_v2]']").change(function() {
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望する", ".construction_type_07_03_v1");
SetRequiredContent2("construction_type_07_02_v2", "分解洗浄を希望しない", ".construction_type_07_03_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設6~14畳(取外し含む)", ".construction_type_07_04_v1");
SetRequiredContent2("construction_type_07_03_v1", "移設16~20畳(取外し含む)", ".construction_type_07_04_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設23畳~(取外し含む)", ".construction_type_07_04_v3");
});
$("input[name='loan[construction_type_07_03_v1]']").change(function() {
SetRequiredContent2("construction_type_07_03_v1", "移設6~14畳(取外し含む)", ".construction_type_07_04_v1");
SetRequiredContent2("construction_type_07_03_v1", "移設16~20畳(取外し含む)", ".construction_type_07_04_v2");
SetRequiredContent2("construction_type_07_03_v1", "移設23畳~(取外し含む)", ".construction_type_07_04_v3");
});
$("input[name='loan[electrical_outlet_07]']").change(function() {
SetRequiredContent2("electrical_outlet_07", "あり", ".electrical_outlet_07_02");
});
$("input[name='loan[room_size_07]']").change(function() {
SetRequiredContent2("room_size_07", "なし", ".room_size_07_02");
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書あり", ".room_size_07_03_v1");
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書なし", ".room_size_07_03_v2");
});
$("input[name='loan[room_size_07_02]']").change(function() {
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書あり", ".room_size_07_03_v1");
SetRequiredContent2("room_size_07_02", "建物が2009年6月以降に着工した証明書なし", ".room_size_07_03_v2");
});
$("input[name='loan[piping_status_07]']").change(function() {
SetRequiredContent2("piping_status_07", "隠蔽配管", ".piping_status_07_02");
});
$("input[name='loan[outdoor_cover]']").change(function() {
SetRequiredContent2("outdoor_cover", "必要", ".outdoor_cover_02");
});
$("input[name='loan[setting_install_method]']").change(function() {
SetRequiredContent2("setting_install_method", "新規取付", ".construction_method_07_v1");
SetRequiredContent2("setting_install_method", "交換", ".construction_method_07_v2");
});
CalcConstructionNumber();
$('.construction_air').on('change', function() {
if ($('.construction_air:checked').length > 0) {
$('.construction_air').removeAttr('required');
}
else {
$('.construction_air').attr('required', 'required');
}
CalcConstructionNumber();
CalcPrice();
});
CalcPrice();
$('input[type="radio"]').on('change', function() {
CalcPrice();
});
});
function SetRequiredContent() {
{% if (checkCategory == 1) %}
$("input[name='loan[desired_construction_work]'][value='本体+設置工事']").prop('checked', true);
$(".ec-form-inquiry__group .table .list-item .item.active>table:first-child()").css('display', 'none');
$("input[name='loan[desired_construction_work_02]'][value='最終金額算出']").prop('checked', true);
{% endif %}
var selectedValue = $("input[name='loan[desired_construction_work]']:checked").val();
if (selectedValue === "本体+設置工事") {
$("#tableUnderTop").css("display", "table");
$("#tableUnderTop input").each(function(index, el) {
if ($(this).attr('type') != 'hidden') {
$(this).attr('required', 'required');
}
});
}
else {
$("#tableUnderTop").css("display", "none");
$("#tableSecond").css("display", "none");
$("#tableUnderTop input, #tableSecond input").each(function(index, el) {
$(this).prop('checked', false).removeAttr('required');
});
}
}
function SetRequiredContent1() {
var selectedValue = $("input[name='loan[desired_construction_work_02]']:checked").val();
if (selectedValue === "最終金額算出") {
$("#tableSecond").css("display", "table");
$("#tableSecond .content-1 input").each(function(index, el) {
if ($(this).attr('name') != 'loan[construction_date_2]' && $(this).attr('name') != 'loan[construction_date_3]' && $(this).attr('type') != 'hidden') {
$(this).attr('required', 'required');
}
});
}
else {
$("#tableSecond").css("display", "none");
$("#tableSecond .content-1 input").each(function(index, el) {
$(this).prop('checked', false).removeAttr('required');
});
}
}
function SetRequiredContent2(nameInput, condition , classCheck) {
var selectedValue = $("input[name='loan["+ nameInput +"]']:checked").val();
if (selectedValue === condition) {
$(classCheck).css("display", "flex");
$("#tableSecond " + classCheck + " input").each(function(index, el) {
if ($(this).attr('type') != 'hidden') {
$(this).attr('required', 'required');
}
});
} else {
$(classCheck).css("display", "none");
$("#tableSecond " + classCheck + " input").each(function(index, el) {
$(this).prop('checked', false).removeAttr('required');
});
}
}
/**
* Tính giá tiền
*/
function CalcPrice() {
var product_total_price = Number($('#product_total_price').val());
$('#construction_base_price_1').val(0);
$('#construction_base_price_2').val(0);
$('#construction_base_price_3').val(0);
$('#construction_total_price').val(0);
$('#construction_discount').val(0);
$('#total-price').text(numeral(product_total_price).format('0,0') + "円");
$('.product_price').text(numeral(product_total_price).format('0,0'));
$('.base_price').text(0);
$('.add_price').text(0);
}
/**
* Đếm số lượng cần thi công
*/
function CalcConstructionNumber() {
CountTatami.countType1 = 0;
CountTatami.countType2 = 0;
CountTatami.countType3 = 0;
CountTatamiAll.countType1 = 0;
CountTatamiAll.countType2 = 0;
CountTatamiAll.countType3 = 0;
CountTatamiLoan.countType1 = 0;
CountTatamiLoan.countType2 = 0;
CountTatamiLoan.countType3 = 0;
var construction_air = []
var product_total_price = 0;
$('.construction_air').each(function(index, el) {
let quantity = $(this).data('quantity');
let price = $(this).data('price');
let tatami = $(this).data('tatami');
let loan = $(this).data('loan');
if (tatami >= 6 && tatami <= 14) {
CountTatamiAll.countType1 += quantity;
if (loan == 1) {
CountTatamiLoan.countType1 += quantity;
}
} else if (tatami >= 16 && tatami <= 20) {
CountTatamiAll.countType2 += quantity;
if (loan == 1) {
CountTatamiLoan.countType2 += quantity;
}
} else if (tatami >= 23) {
CountTatamiAll.countType3 += quantity;
if (loan == 1) {
CountTatamiLoan.countType3 += quantity;
}
}
if ($(this).is(':checked')) {
product_total_price += price;
if (tatami >= 6 && tatami <= 14) {
CountTatami.countType1 += quantity;
} else if (tatami >= 16 && tatami <= 20) {
CountTatami.countType2 += quantity;
} else if (tatami >= 23) {
CountTatami.countType3 += quantity;
}
construction_air.push($(this).val());
}
});
$('#loan_construction_air').val(construction_air.toString());
$('#loan_number_install').val(CountTatami.countType1 + CountTatami.countType2 + CountTatami.countType3);
$('#product_total_price').val(product_total_price);
}
</script>
{% endblock javascript %}
{% block main %}
<div class="ec-inquiry-page">
<div class="ec-banner">
<div class="ec-banner__inner">
<div class="inner">
<h2>
エアココ自社ローン審査フォーム
</h2>
</div>
</div>
<div class="ec-breadcrumb">
<ul class="ec-breadcrumb__menu">
<li class="ec-breadcrumb__item"><a href="{{ url('homepage') }}">TOP</a></li>
<li class="ec-breadcrumb__item"><span>></span></li>
<li class="ec-breadcrumb__item"><p>エアココ自社ローン審査フォーム</p></li>
</ul>
</div>
</div>
<div class="ec-form-inquiry-main">
<div class="ec-form-inquiry__inner">
<div class="inner">
<div class="ec-form-inquiry__group">
<div class="ec-form-inquiry__group__step">
<ul class="ec-form-inquiry__group__step__items">
<li class="ec-form-inquiry__group__step__item step-1 active" data-step="1">
<span>STEP1</span>
<span>ご本人様について</span>
</li>
<li class="ec-form-inquiry__group__step__item step-2" data-step="2">
<span>STEP2</span>
<span>お勤め先・ご収入</span>
</li>
<li class="ec-form-inquiry__group__step__item step-3" data-step="3">
<span>STEP3</span>
<span>連帯保証人の方</span>
</li>
<li class="ec-form-inquiry__group__step__item step-4" data-step="4">
<span>STEP4</span>
<span>工事内容の最終確認</span>
</li>
<li class="ec-form-inquiry__group__step__item step-5" data-step="5">
<span>STEP5</span>
<span>ご確認</span>
</li>
<li class="ec-form-inquiry__group__step__item step-6" data-step="6">
<span>STEP6</span>
<span>完了</span>
</li>
</ul>
</div>
<form id="loan_examination_form" method="post" action="{{ url('loan_examination') }}" class="h-adr" enctype="multipart/form-data">
<span class="p-country-name" style="display:none;">Japan</span>
{{ form_widget(form._token) }}
<div class="step-content step-1 active">
<div class="step-content__title">ご本人様について</div>
<div class="table">
{# <p class="text top">必須項目 <span>※</span></p> #}
<div class="list-item">
<div class="item">
<table>
<tr>
<td><p>お名前</p></td>
<td>
<div class="fill">
<label>
姓
{{ form_widget(form.name.name01, {'attr': { 'placeholder': '姓' }}) }}
</label>
</div>
<div class="fill">
<label>
名
{{ form_widget(form.name.name02, {'attr': { 'placeholder': '名' }}) }}
</label>
</div>
{{ form_errors(form.name.name01) }}
{{ form_errors(form.name.name02) }}
</td>
</tr>
<tr>
<td><p>フリガナ</p></td>
<td>
<div class="fill">
<label>
セイ
{{ form_widget(form.kana.kana01, {'attr': { 'placeholder': 'セイ' }}) }}
</label>
</div>
<div class="fill">
<label>
メイ
{{ form_widget(form.kana.kana02, {'attr': { 'placeholder': 'メイ' }}) }}
</label>
</div>
{{ form_errors(form.kana.kana01) }}
{{ form_errors(form.kana.kana02) }}
</td>
</tr>
<tr>
<td><p>性別</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.sex.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.sex.vars.full_name }}" value="{{ val.value }}" {% if form.sex.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.sex) }}
</td>
</tr>
<tr>
<td><p>生年月日</p></td>
<td>
<div class="fill v2">
<label class="group_select">
<div class="select vip">
{{ form_widget(form.birth.year) }}<span>年</span>
</div>
<div class="select vip">
{{ form_widget(form.birth.month) }}<span>月</span>
</div>
<div class="select vip">
{{ form_widget(form.birth.day) }}<span>日</span>
</div>
</label>
</div>
{{ form_errors(form.birth) }}
</td>
</tr>
<tr>
<td><p>住所</p></td>
<td>
<div class="fill v3">
<label class="label v2">
郵便番号
{{ form_widget(form.postal_code) }}
<a class="btn-post postal_code" href="https://www.post.japanpost.jp/zipcode/" target="_blank"><span>{{ '住所検索'|trans }}</span></a>
</label>
{{ form_errors(form.postal_code) }}
<label class="label v3 address">
都道府県
<div class="select">
{{ form_widget(form.address.pref) }}
</div>
</label>
{{ form_errors(form.address.pref) }}
<label class="label v4 address">
市区町村・番地
{{ form_widget(form.address.addr01, { 'attr': { 'placeholder': '市区町村名(例:大阪市北区)' }}) }}
</label>
{{ form_errors(form.address.addr01) }}
<label class="label v4 address">
マンション・ビル名
{{ form_widget(form.address.addr02, { 'attr': { 'placeholder': '番地・ビル名(例:西梅田1丁目6-8)' }}) }}
</label>
{{ form_errors(form.address.addr02) }}
</div>
</td>
</tr>
<tr>
<td><p>電話番号(ご自宅)</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.tel_number_type.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.tel_number_type.vars.full_name }}" value="{{ val.value }}" {% if form.tel_number_type.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.tel_number_type) }}
<div class="fill v2">
<label>
{{ form_widget(form.tel_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.tel_number) }}
</td>
</tr>
<tr>
<td><p>電話番号(携帯)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.phone_number) }}
</td>
</tr>
<tr>
<td><p>メールアドレス</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.email, {'attr': { 'placeholder': 'example@example.com' }}) }}
</label>
</div>
{{ form_errors(form.email) }}
</td>
</tr>
<tr>
<td><p>配偶者</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.spouse.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.spouse.vars.full_name }}" value="{{ val.value }}" {% if form.spouse.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.spouse) }}
</td>
</tr>
<tr>
<td><p>配偶者の職業</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.spouse_job) }}
</div>
</div>
{{ form_errors(form.spouse_job) }}
</td>
</tr>
<tr>
<td><p>世帯主とのご関係</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.relationship.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.relationship.vars.full_name }}" value="{{ val.value }}" {% if form.relationship.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
<label>
{{ form_widget(form.relationship_other, {'attr': { 'style': 'width: 120px;' }}) }}
</label>
</div>
{{ form_errors(form.relationship) }}
{{ form_errors(form.relationship_other) }}
</td>
</tr>
<tr>
<td><p>世帯人数</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.people_cnt, {'attr': { 'style': 'width: 120px;' }}) }} <span>人</span>
</label>
</div>
{{ form_errors(form.people_cnt) }}
</td>
</tr>
<tr>
<td><p>住宅ローン/家賃支払い</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.housing_loan.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.housing_loan.vars.full_name }}" value="{{ val.value }}" {% if form.housing_loan.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.housing_loan) }}
<p class="noice">※お申込者ご自身またはお申込者と同一世帯の方の住宅ローン・家賃のお支払有無をご選択ください。「世帯」とは、お申込者と生計を共にする家族のことをいいます(同居・別居を問わず)。</p>
</td>
</tr>
<tr>
<td><p>住居区分</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.housing_type) }}
</div>
</div>
{{ form_errors(form.housing_type) }}
</td>
</tr>
<tr>
<td><p>居住年数</p></td>
<td>
<div class="fill horizontal">
<label>
{{ form_widget(form.residence_year, {'attr': { 'style': 'width: 120px;' }}) }} <span>年</span>
</label>
</div>
<div class="fill horizontal">
<label>
{{ form_widget(form.residence_month, {'attr': { 'style': 'width: 120px;' }}) }} <span>ヶ月</span>
</label>
</div>
{{ form_errors(form.residence_year) }}
{{ form_errors(form.residence_month) }}
</td>
</tr>
<tr>
<td><p>職業</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.job) }}
</div>
</div>
{{ form_errors(form.job) }}
</td>
</tr>
<tr>
<td><p>世帯主との居住状況</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.head_of_household.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.head_of_household.vars.full_name }}" value="{{ val.value }}" {% if form.head_of_household.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.head_of_household) }}
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="step-content step-2">
<div class="step-content__title">お勤め先・ご収入について</div>
<div class="table" id="employed">
<div class="table__title">
<p class="step-content__subtitle">【有職者の方】パート・アルバイト含む</p>
{# <p class="text top">必須項目 <span>※</span></p> #}
</div>
<div class="list-item">
<div class="item">
<table>
<tr>
<td><p>職業</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.employed_job) }}
</div>
</div>
{{ form_errors(form.employed_job) }}
</td>
</tr>
<tr>
<td><p>業種</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.employed_industry) }}
</div>
</div>
{{ form_errors(form.employed_industry) }}
</td>
</tr>
<tr>
<td><p>お勤め先(派遣元)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.employed_company) }}
</label>
</div>
{{ form_errors(form.employed_company) }}
</td>
</tr>
<tr>
<td><p>お勤め先フリガナ</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.employed_company_kana) }}
</label>
</div>
{{ form_errors(form.employed_company_kana) }}
</td>
</tr>
<tr>
<td><p>お勤め先住所</p></td>
<td>
<div class="fill v3">
<label class="label v2">
郵便番号
{{ form_widget(form.employed_postal_code) }}
<a class="btn-post employed_postal_code" href="https://www.post.japanpost.jp/zipcode/" target="_blank"><span>{{ '住所検索'|trans }}</span></a>
</label>
{{ form_errors(form.employed_postal_code) }}
<label class="label v3 address">
都道府県
<div class="select">
{{ form_widget(form.employed_address_pref) }}
</div>
</label>
{{ form_errors(form.employed_address_pref) }}
<label class="label v4 address">
市区町村・番地
{{ form_widget(form.employed_address_addr01, { 'attr': { 'placeholder': '市区町村名(例:大阪市北区)' }}) }}
</label>
{{ form_errors(form.employed_address_addr01) }}
<label class="label v4 address">
マンション・ビル名
{{ form_widget(form.employed_address_addr02, { 'attr': { 'placeholder': '番地・ビル名(例:西梅田1丁目6-8)' }}) }}
</label>
{{ form_errors(form.employed_address_addr02) }}
</div>
</td>
</tr>
<tr>
<td><p>お勤め先電話番号</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.employed_phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.employed_phone_number) }}
</td>
</tr>
<tr>
<td><p>勤続年数</p></td>
<td>
<div class="fill horizontal">
<label>
{{ form_widget(form.employed_year, {'attr': { 'style': 'width: 120px;' }}) }} <span>年</span>
</label>
</div>
<div class="fill horizontal">
<label>
{{ form_widget(form.employed_month, {'attr': { 'style': 'width: 120px;' }}) }} <span>ヶ月</span>
</label>
</div>
{{ form_errors(form.employed_year) }}
{{ form_errors(form.employed_month) }}
</td>
</tr>
<tr>
<td><p>税込年収</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.employed_income, {'attr': { 'style': 'width: 120px;' }}) }} <span>万円</span>
</label>
</div>
{{ form_errors(form.employed_income) }}
</td>
</tr>
<tr>
<td><p>従業員数</p></td>
<td>
<div class="fill v2">
<div class="select">
{{ form_widget(form.employed_cnt) }}
</div>
</div>
{{ form_errors(form.employed_cnt) }}
</td>
</tr>
<tr>
<td><p>出向先・派遣先電話番号</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.employed_company_phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.employed_company_phone_number) }}
</td>
</tr>
</table>
</div>
</div>
</div>
<div class="table" id="pensioner">
<div class="table__title">
<p class="step-content__subtitle">【主婦・年金受給者の方】</p>
{# <p class="text top">必須項目 <span>※</span></p> #}
</div>
<div class="list-item">
<div class="item">
<table>
<tr>
<td><p>世帯主お名前</p></td>
<td>
<div class="fill">
<label>
姓
{{ form_widget(form.pensioner_name.pensioner_name01, {'attr': { 'placeholder': '姓' }}) }}
</label>
</div>
<div class="fill">
<label>
名
{{ form_widget(form.pensioner_name.pensioner_name02, {'attr': { 'placeholder': '名' }}) }}
</label>
</div>
{{ form_errors(form.pensioner_name.pensioner_name01) }}
{{ form_errors(form.pensioner_name.pensioner_name02) }}
</td>
</tr>
<tr>
<td><p>フリガナ</p></td>
<td>
<div class="fill">
<label>
セイ
{{ form_widget(form.pensioner_kana.pensioner_kana01, {'attr': { 'placeholder': 'セイ' }}) }}
</label>
</div>
<div class="fill">
<label>
メイ
{{ form_widget(form.pensioner_kana.pensioner_kana02, {'attr': { 'placeholder': 'メイ' }}) }}
</label>
</div>
{{ form_errors(form.pensioner_kana.pensioner_kana01) }}
{{ form_errors(form.pensioner_kana.pensioner_kana02) }}
</td>
</tr>
<tr>
<td><p>世帯主税込年収</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.pensioner_income, {'attr': { 'style': 'width: 120px;' }}) }} <span>万円</span>
</label>
</div>
{{ form_errors(form.pensioner_income) }}
</td>
</tr>
<tr>
<td><p>世帯主のお支払中の<br>クレジット返済額</p></td>
<td>
<div>
<div class="fill horizontal">
{% for key,val in form.household_paying.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.household_paying.vars.full_name }}" value="{{ val.value }}" {% if form.household_paying.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.household_paying) }}
<div class="fill horizontal">
<div style="margin-right: 2rem;">
<p>有りとご回答された方 毎月の支払額</p>
<p class="noice">※住宅ローン・無担保ローンを除く</p>
</div>
<label>
{{ form_widget(form.household_paying_amount, {'attr': { 'style': 'width: 120px;' }}) }} <span>万円</span>
</label>
</div>
{{ form_errors(form.household_paying_amount) }}
</div>
</td>
</tr>
<tr>
<td><p>年金の種類</p></td>
<td>
<div class="fill horizontal">
{{ form_widget(form.pensioner_type) }}
<label>
{{ form_widget(form.pensioner_type_other, {'attr': { 'style': 'width: 120px;' }}) }}
</label>
</div>
{{ form_errors(form.pensioner_type) }}
{{ form_errors(form.pensioner_type_other) }}
</td>
</tr>
<tr>
<td><p>年金以外の収入</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.pensioner_income_other.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.pensioner_income_other.vars.full_name }}" value="{{ val.value }}" {% if form.pensioner_income_other.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.pensioner_income_other) }}
</td>
</tr>
<tr>
<td><p>今回のお支払い</p></td>
<td>
<div class="fill horizontal">
{{ form_widget(form.pensioner_payment) }}
<label>
{{ form_widget(form.pensioner_payment_other, {'attr': { 'style': 'width: 120px;' }}) }}
</label>
</div>
{{ form_errors(form.pensioner_payment) }}
{{ form_errors(form.pensioner_payment_other) }}
</td>
</tr>
<tr>
<td><p>お勤め先電話番号</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.pensioner_company_phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.pensioner_company_phone_number) }}
</td>
</tr>
<tr>
<td><p>年金受給者の税込年収</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.pensioner_income2, {'attr': { 'style': 'width: 120px;' }}) }} <span>万円</span>
</label>
</div>
{{ form_errors(form.pensioner_income2) }}
</td>
</tr>
<tr>
<td><p>口座名義人</p></td>
<td>
<div>
<div class="fill horizontal">
{% for key,val in form.pensioner_acount.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.pensioner_acount.vars.full_name }}" value="{{ val.value }}" {% if form.pensioner_acount.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.pensioner_acount) }}
<p class="noice">※口座名義人が申込者の場合、連帯保証人が必要となる場合があります。</p>
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="step-content step-3">
<div class="step-content__title">連帯保証人の方</div>
<div class="table">
{# <p class="text top">必須項目 <span>※</span></p> #}
<div class="list-item">
<div class="item">
<table>
<tr>
<td><p>お名前</p></td>
<td>
<div class="fill">
<label>
姓
{{ form_widget(form.guarantor_name.guarantor_name01, {'attr': { 'placeholder': '姓' }}) }}
</label>
</div>
<div class="fill">
<label>
名
{{ form_widget(form.guarantor_name.guarantor_name02, {'attr': { 'placeholder': '名' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_name.guarantor_name01) }}
{{ form_errors(form.guarantor_name.guarantor_name02) }}
</td>
</tr>
<tr>
<td><p>フリガナ</p></td>
<td>
<div class="fill">
<label>
セイ
{{ form_widget(form.guarantor_kana.guarantor_kana01, {'attr': { 'placeholder': 'セイ' }}) }}
</label>
</div>
<div class="fill">
<label>
メイ
{{ form_widget(form.guarantor_kana.guarantor_kana02, {'attr': { 'placeholder': 'メイ' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_kana.guarantor_kana01) }}
{{ form_errors(form.guarantor_kana.guarantor_kana02) }}
</td>
</tr>
<tr>
<td><p>性別</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.guarantor_sex.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.guarantor_sex.vars.full_name }}" value="{{ val.value }}" {% if form.guarantor_sex.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.guarantor_sex) }}
</td>
</tr>
<tr>
<td><p>生年月日</p></td>
<td>
<div class="fill v2">
<label class="group_select">
<div class="select vip">
{{ form_widget(form.guarantor_birth.year) }}<span>年</span>
</div>
<div class="select vip">
{{ form_widget(form.guarantor_birth.month) }}<span>月</span>
</div>
<div class="select vip">
{{ form_widget(form.guarantor_birth.day) }}<span>日</span>
</div>
</label>
</div>
{{ form_errors(form.guarantor_birth) }}
</td>
</tr>
<tr>
<td><p>住所</p></td>
<td>
<div class="fill v3">
<label class="label v2">
郵便番号
{{ form_widget(form.guarantor_postal_code) }}
<a class="btn-post guarantor_postal_code" href="https://www.post.japanpost.jp/zipcode/" target="_blank"><span>{{ '住所検索'|trans }}</span></a>
</label>
{{ form_errors(form.guarantor_postal_code) }}
<label class="label v3 address">
都道府県
<div class="select">
{{ form_widget(form.guarantor_address_pref) }}
</div>
</label>
{{ form_errors(form.guarantor_address_pref) }}
<label class="label v4 address">
市区町村・番地
{{ form_widget(form.guarantor_address_addr01, { 'attr': { 'placeholder': '市区町村名(例:大阪市北区)' }}) }}
</label>
{{ form_errors(form.guarantor_address_addr01) }}
<label class="label v4 address">
マンション・ビル名
{{ form_widget(form.guarantor_address_addr02, { 'attr': { 'placeholder': '番地・ビル名(例:西梅田1丁目6-8)' }}) }}
</label>
{{ form_errors(form.guarantor_address_addr02) }}
</div>
</td>
</tr>
<tr>
<td><p>電話番号(ご自宅)</p></td>
<td>
<div class="fill horizontal">
{% for key,val in form.guarantor_tel_number_type.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.guarantor_tel_number_type.vars.full_name }}" value="{{ val.value }}" {% if form.guarantor_tel_number_type.vars.data == val.value %}checked{% endif %} required="required" />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.guarantor_tel_number_type) }}
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_tel_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_tel_number) }}
</td>
</tr>
<tr>
<td><p>電話番号(携帯)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_phone_number) }}
</td>
</tr>
<tr>
<td><p>メールアドレス<br>(半角英数字)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_email, {'attr': { 'placeholder': 'example@example.com' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_email) }}
</td>
</tr>
<tr>
<td><p>メールアドレス確認用<br>(半角英数字)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_email_confirm, {'attr': { 'placeholder': 'example@example.com' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_email_confirm) }}
</td>
</tr>
<tr>
<td><p>契約者との続柄</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_relation) }}
</label>
</div>
{{ form_errors(form.guarantor_relation) }}
</td>
</tr>
<tr>
<td><p>職業</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.guarantor_job) }}
</div>
</div>
{{ form_errors(form.guarantor_job) }}
</td>
</tr>
<tr>
<td><p>業種</p></td>
<td>
<div class="fill v4">
<div class="select">
{{ form_widget(form.guarantor_industry) }}
</div>
</div>
{{ form_errors(form.guarantor_industry) }}
</td>
</tr>
<tr>
<td><p>お勤め先(派遣元)</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_company) }}
</label>
</div>
{{ form_errors(form.guarantor_company) }}
</td>
</tr>
<tr>
<td><p>お勤め先フリガナ</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_company_kana) }}
</label>
</div>
{{ form_errors(form.guarantor_company_kana) }}
</td>
</tr>
<tr>
<td><p>お勤め先住所</p></td>
<td>
<div class="fill v3">
<label class="label v2">
郵便番号
{{ form_widget(form.guarantor_company_postal_code) }}
<a class="btn-post guarantor_company_postal_code" href="https://www.post.japanpost.jp/zipcode/" target="_blank"><span>{{ '住所検索'|trans }}</span></a>
</label>
{{ form_errors(form.guarantor_company_postal_code) }}
<label class="label v3 address">
都道府県
<div class="select">
{{ form_widget(form.guarantor_company_address_pref) }}
</div>
</label>
{{ form_errors(form.guarantor_company_address_pref) }}
<label class="label v4 address">
市区町村・番地
{{ form_widget(form.guarantor_company_address_addr01, { 'attr': { 'placeholder': '市区町村名(例:大阪市北区)' }}) }}
</label>
{{ form_errors(form.guarantor_company_address_addr01) }}
<label class="label v4 address">
マンション・ビル名
{{ form_widget(form.guarantor_company_address_addr02, { 'attr': { 'placeholder': '番地・ビル名(例:西梅田1丁目6-8)' }}) }}
</label>
{{ form_errors(form.guarantor_company_address_addr02) }}
</div>
</td>
</tr>
<tr>
<td><p>お勤め先電話番号</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_company_phone_number, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_company_phone_number) }}
</td>
</tr>
<tr>
<td><p>勤続年数</p></td>
<td>
<div class="fill horizontal">
<label>
{{ form_widget(form.guarantor_year, {'attr': { 'style': 'width: 120px;' }}) }} <span>年</span>
</label>
</div>
<div class="fill horizontal">
<label>
{{ form_widget(form.guarantor_month, {'attr': { 'style': 'width: 120px;' }}) }} <span>ヶ月</span>
</label>
</div>
{{ form_errors(form.guarantor_year) }}
{{ form_errors(form.guarantor_month) }}
</td>
</tr>
<tr>
<td><p>税込年収</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_income, {'attr': { 'style': 'width: 120px;' }}) }} <span>万円</span>
</label>
</div>
{{ form_errors(form.guarantor_income) }}
</td>
</tr>
<tr>
<td><p>従業員数</p></td>
<td>
<div class="fill v2">
<div class="select">
{{ form_widget(form.guarantor_cnt) }}
</div>
</div>
{{ form_errors(form.guarantor_cnt) }}
</td>
</tr>
<tr>
<td><p>出向先・派遣先電話番号</p></td>
<td>
<div class="fill v2">
<label>
{{ form_widget(form.guarantor_company_phone_number2, {'attr': { 'placeholder': '000-0000-0000' }}) }}
</label>
</div>
{{ form_errors(form.guarantor_company_phone_number2) }}
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="step-content step-4">
<div class="step-content__title">工事内容の最終確認</div>
<div class="table">
{# <p class="text top">必須項目 <span>※</span></p> #}
<div class="list-item">
<div class="item">
<input type="hidden" id="product_total_price" name="{{ form.product_total_price.vars.full_name }}" value="{{ productTotalPrice }}">
<div class="table">
<div class="list-item">
<div class="item active">
<table>
<tr>
<td><p>希望する工事</p></td>
<td>
<div class="fill v4">
{% for key,val in form.desired_construction_work.vars.choices %}
<div>
<label class="form-check">
<input type="radio" name="{{ form.desired_construction_work.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.desired_construction_work.vars.data == val.value %}checked{% endif %} required />
{{ val.label | trans }}
</label>
</div>
{% endfor %}
</div>
{{ form_errors(form.desired_construction_work) }}
</td>
</tr>
</table>
<table id="tableUnderTop" style="padding: 0;">
<tr class="desired_construction_work_02">
<td><p>希望する工事</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.desired_construction_work_02.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.desired_construction_work_02.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.desired_construction_work_02.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "新居等への引越しのため設置場所の詳細確認不可" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.desired_construction_work_02) }}
</td>
</tr>
</table>
<table id="tableSecond" style="padding: 0;">
{% if (countProductBasic != 0) %}
<tr class="content-1">
<td><p>特急券の購入</p></td>
<td>
<div class="fill v4">
{% for key,val in form.express_tickets.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.express_tickets.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.express_tickets.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.express_tickets_price) }}
</div>
{{ form_errors(form.express_tickets) }}
</td>
</tr>
{% endif %}
<tr class="content-1">
<td><p>お住まい</p></td>
<td>
<div class="fill v4">
{% for key,val in form.osumai.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.osumai.vars.full_name }}" data-percent="{{ val.attr['percent'] | default(0) }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.osumai.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.osumai) }}
</td>
</tr>
<tr class="content-1">
<td><p>建物の所有</p></td>
<td>
<div class="fill v4">
{% for key,val in form.building_ownership.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.building_ownership.vars.full_name }}" data-percent="{{ val.attr['percent'] | default(0) }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.building_ownership.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "賃貸" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事内容によっては受付出来ない可能性もございます。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.building_ownership) }}
</td>
</tr>
<tr class="content-1">
<td><p>構造</p></td>
<td>
<div class="fill v4">
{% for key,val in form.structure.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.structure.vars.full_name }}" data-percent="{{ val.attr['percent'] | default(0) }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.structure.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.structure) }}
</td>
</tr>
<tr class="content-1">
<td><p>設置台数</p></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_airs.vars.choices %}
{% set has_checked = false %}
{% for key2,val2 in form.construction_airs.vars.data %}
{% if val.value == val2 %}
{% set has_checked = true %}
<label class="form-check">
<input type="checkbox"
name="{{ form.construction_airs.vars.full_name }}"
class="construction_air"
data-tatami="{{ val.attr['data-tatami'] | default(0) }}" data-quantity="{{ val.attr['data-quantity'] | default(0) }}"
data-price="{{ val.attr['data-price'] | default(0) }}"
data-loan="{{ val.attr['data-loan'] | default(0) }}"
value="{{ val.value }}" checked />
{{ val.data | trans }}
</label>
{% endif %}
{% endfor %}
{% if has_checked == false %}
<label class="form-check">
<input type="checkbox"
name="{{ form.construction_airs.vars.full_name }}"
class="construction_air"
data-tatami="{{ val.attr['data-tatami'] | default(0) }}"
data-quantity="{{ val.attr['data-quantity'] | default(0) }}"
data-price="{{ val.attr['data-price'] | default(0) }}"
data-loan="{{ val.attr['data-loan'] | default(0) }}"
value="{{ val.value }}"/>
{{ val.data | trans }}
</label>
{% endif %}
{% endfor %}
{{ form_widget(form.construction_air) }}
{{ form_widget(form.number_install) }}
{{ form_widget(form.number_install_price) }}
</div>
{{ form_errors(form.construction_airs) }}
</td>
</tr>
<tr class="content-1">
<td><p>設置工事希望日</p></td>
<td>
<div class="fill v3">
<label class="label v3 date vip">
第一希望日
{{ form_widget(form.construction_date_1) }}
{{ form_errors(form.construction_date_1) }}
<span class="pc"> </span>希望時間帯
<select name="{{ form.time_slot_1.vars.full_name }}" id="time_slot_1">
{% for key,val in form.time_slot_1.vars.choices %}
<option value="{{ val.value }}">{{ val.label | trans }} </option>
{% endfor %}
</select>
</label>
<label class="label v3 date">
第二希望日
{{ form_widget(form.construction_date_2) }}
{{ form_errors(form.construction_date_2) }}
<span class="pc"> </span>希望時間帯
<select name="{{ form.time_slot_2.vars.full_name }}" id="time_slot_2">
{% for key,val in form.time_slot_2.vars.choices %}
<option value="{{ val.value }}">{{ val.label | trans }} </option>
{% endfor %}
</select>
</label>
<label class="label v3 date">
第三希望日
{{ form_widget(form.construction_date_3) }}
{{ form_errors(form.construction_date_3) }}
<span class="pc"> </span>希望時間帯
<select name="{{ form.time_slot_3.vars.full_name }}" id="time_slot_3">
{% for key,val in form.time_slot_3.vars.choices %}
<option value="{{ val.value }}">{{ val.label | trans }} </option>
{% endfor %}
</select>
</label>
{{ form_widget(form.contents, {'attr': { 'placeholder': 'その他希望等あればご記入ください。' }}) }}
{{ form_errors(form.contents) }}
</div>
</td>
</tr>
<tr class="content-1">
<td><p>工事内訳</p></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "新設工事に加えて移設工事も希望" %}
<p style="padding-left: 2rem;font-size: 0.8em;margin-bottom: 0.5rem;line-height: 1.2;">※エアコン本体の移動はお客様ご自身でお願いいたします。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.construction_type_07) }}
</td>
</tr>
<tr class="construction_type_07_02_v1">
<td><p>工事内訳</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_02_v1.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_02_v1.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_02_v1.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.construction_type_07_02_v1_price) }}
</div>
{{ form_errors(form.construction_type_07_02_v1) }}
</td>
</tr>
<tr class="construction_type_07_02_v2">
<td><p>工事内訳</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_02_v2.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_02_v2.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_02_v2.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.construction_type_07_02_v2) }}
</td>
</tr>
<tr class="construction_type_07_03_v1">
<td><p>工事内訳</p><small>3段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_03_v1.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_03_v1.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_03_v1.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.construction_type_07_03_v1) }}
</td>
</tr>
<tr class="construction_type_07_03_v2">
<td><p>工事内訳</p><small>3段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_03_v2.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_03_v2.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_03_v2.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.construction_type_07_03_v2_price) }}
</div>
{{ form_errors(form.construction_type_07_03_v2) }}
</td>
</tr>
<tr class="construction_type_07_04_v1">
<td><p>工事内訳</p><small>4段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_04_v1.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_04_v1.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_04_v1.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.construction_type_07_04_v1_price) }}
</div>
{{ form_errors(form.construction_type_07_04_v1) }}
</td>
</tr>
<tr class="construction_type_07_04_v2">
<td><p>工事内訳</p><small>4段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_04_v2.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_04_v2.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_04_v2.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.construction_type_07_04_v2_price) }}
</div>
{{ form_errors(form.construction_type_07_04_v2) }}
</td>
</tr>
<tr class="construction_type_07_04_v3">
<td><p>工事内訳</p><small>4段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_type_07_04_v3.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_type_07_04_v3.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_type_07_04_v3.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.construction_type_07_04_v3_price) }}
</div>
{{ form_errors(form.construction_type_07_04_v3) }}
</td>
</tr>
<tr class="content-1">
<td><p>エアコン設置場所</p></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_floor_07.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.construction_floor_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_floor_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.construction_floor_07) }}
</td>
</tr>
<tr class="content-1">
<td><p>エレベーターの有無</p><small>※3階以上の場合</small></td>
<td>
<div class="fill v4">
{% for key,val in form.elevator_07.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.elevator_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.elevator_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_errors(form.elevator_07) }}
{{ form_widget(form.elevator_07_price) }}
</div>
</td>
</tr>
<tr class="content-1">
<td><p>コンセントの有無</p></td>
<td>
<div class="fill v4">
{% for key,val in form.electrical_outlet_07.vars.choices %}
<label class="form-check flex" style="display: flex; align-items: center;flex-wrap: wrap;">
<input type="radio" name="{{ form.electrical_outlet_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.electrical_outlet_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "なし(別途工事が必要になります)" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.2;">※10m以上の方は別途お見積りさせていただきます。</p>
{% endif %}
{% if val.value == "不明" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.2;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
{{ form_errors(form.electrical_outlet_07) }}
{{ form_widget(form.electrical_outlet_07_price) }}
</div>
</td>
</tr>
<tr class="electrical_outlet_07_02">
<td><p>コンセントの有無</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.electrical_outlet_07_02.vars.choices %}
<label class="form-check flex" style="display: flex; align-items: center;flex-wrap: wrap;">
<input type="radio" name="{{ form.electrical_outlet_07_02.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.electrical_outlet_07_02.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_errors(form.electrical_outlet_07_02) }}
{{ form_widget(form.electrical_outlet_07_02_price) }}
</div>
</td>
</tr>
<tr class="content-1">
<td><p>建物の契約アンペア</p></td>
<td>
<div class="fill v4">
{% for key,val in form.contract_amp.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.contract_amp.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.contract_amp.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.contract_amp) }}
</td>
</tr>
<tr class="content-1">
<td><p>コンセントアース端子</p></td>
<td>
<div class="fill v4">
{% for key,val in form.outlet_earth.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.outlet_earth.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.outlet_earth.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
{% if val.value == "なし" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">*工事当日に追加費用がかかる場合があります。</p>
{% endif %}
{% if val.value == "不明" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">*工事当日に追加費用がかかる場合があります。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.outlet_earth) }}
</td>
</tr>
<tr class="content-1">
<td><p>配管穴の有無</p></td>
<td>
<div class="fill v4 vip">
{% for key,val in form.room_size_07.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.room_size_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.room_size_07.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
{% if val.value == "不明" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。別途エアココからご連絡させていただきます。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.room_size_07) }}
<img style="margin-left: auto;" src="{{ asset('assets/img/contact/') }}hole-sample.jpg" alt="配管穴の有無">
</td>
</tr>
{% if (countProductBasic != 0) %}
<tr class="room_size_07_02">
<td><p>配管穴の有無</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.room_size_07_02.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.room_size_07_02.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.room_size_07_02.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.room_size_07_02) }}
</td>
</tr>
{% endif %}
<tr class="room_size_07_03_v1">
<td><p>建物の材質</p><small>(穴あけ&貫通スリーブ費)</small></td>
<td>
<div class="fill v4">
{% for key,val in form.room_size_07_03_v1.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.room_size_07_03_v1.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.room_size_07_03_v1.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
{% if val.value == "その他" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
{% if val.value == "不明" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
{{ form_widget(form.room_size_07_03_v1_price) }}
</div>
{{ form_errors(form.room_size_07_03_v1) }}
</td>
</tr>
<tr class="room_size_07_03_v2">
<td><p>建物の材質</p><small>(穴あけ&貫通スリーブ&アスベストみなし工事、対策費と調査報告書作成費)</small></td>
<td>
<div class="fill v4">
{% for key,val in form.room_size_07_03_v2.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.room_size_07_03_v2.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.room_size_07_03_v2.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
{% if val.value == "その他" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
{% if val.value == "不明" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
{{ form_widget(form.room_size_07_03_v2_price) }}
</div>
{{ form_errors(form.room_size_07_03_v2) }}
</td>
</tr>
<tr class="content-1">
<td><p>設置予定場所の<br class="pc" />配管の状態</p></td>
<td style="flex-direction: column;">
<div class="fill v5 up">
{% set idx = 0 %}
{% for key,val in form.piping_status_07.vars.choices %}
{% set idx = idx + 1 %}
{% if idx <= 2 %}
<div class="group">
<label class="form-check v2">
<input type="radio" name="{{ form.piping_status_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.piping_status_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
<img src="{{ asset('assets/img/form-0y/') }}line-option-0{{ idx }}.jpg" alt="">
</div>
{% endif %}
{% endfor %}
</div>
<div class="fill v5">
{% set idx = 0 %}
{% for key,val in form.piping_status_07.vars.choices %}
{% set idx = idx + 1 %}
{% if idx > 2 %}
<label class="form-check">
<input type="radio" name="{{ form.piping_status_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.piping_status_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endif %}
{% endfor %}
</div>
{{ form_errors(form.piping_status_07) }}
</td>
</tr>
<tr class="piping_status_07_02">
<td><p>設置予定場所の<br class="pc" />配管の状態</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.piping_status_07_02.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.piping_status_07_02.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.piping_status_07_02.vars.data == val.value %}checked{% endif %}/>
{{ val.label | trans }}
</label>
{% endfor %}
{{ form_widget(form.piping_status_07_02_price) }}
</div>
{{ form_errors(form.piping_status_07_02) }}
</td>
</tr>
{% if (countProductBasic != 0) %}
<tr class="content-1">
<td><p>室内化粧カバーの<br class="pc" />希望の有無</p></td>
<td>
<div class="fill v4" style="order: 2;">
{% for key,val in form.indoor_cover_07.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.indoor_cover_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.indoor_cover_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "必要(2m以内)" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※2mを超える場合は追加費用がかかります。</p>
{% endif %}
{% if val.value == "未定" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※化粧カバーが必要になった場合は追加費用がかかります。</p>
{% endif %}
</label>
{% endfor %}
{{ form_widget(form.indoor_cover_07_price) }}
</div>
{{ form_errors(form.indoor_cover_07) }}
<img style="margin-left: auto; order: 3;" src="{{ asset('assets/img/contact/') }}item-1.jpg" alt="室内化粧カバー">
</td>
</tr>
<tr class="content-1">
<td><p>室外化粧カバーの<br class="pc" />希望の有無</p></td>
<td>
<div class="fill v4">
{% for key,val in form.outdoor_cover.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.outdoor_cover.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.outdoor_cover.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "その他" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に必要になった場合、追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
</div>
{{ form_errors(form.outdoor_cover) }}
<img style="margin-left: auto;" src="{{ asset('assets/img/contact/') }}item-2.jpg" alt="室外化粧カバー">
</td>
</tr>
<tr class="outdoor_cover_02">
<td><p>室外化粧カバーの<br class="pc" />希望の有無</p><small>2段階目</small></td>
<td>
<div class="fill v4">
{% for key,val in form.outdoor_cover_02.vars.choices %}
<label class="form-check" >
<input type="radio" name="{{ form.outdoor_cover_02.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.outdoor_cover_02.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "再使用(交換)同階" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※交換にはすでにスリムダクトが付いている方も含みます。</p>
{% endif %}
{% if val.value == "再使用(交換)異階" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※交換にはすでにスリムダクトが付いている方も含みます。</p>
{% endif %}
</label>
{% endfor %}
{{ form_widget(form.outdoor_cover_02_price) }}
</div>
{{ form_errors(form.outdoor_cover_02) }}
</td>
</tr>
<tr class="content-1">
<td><p>室外機の設置場所(既設場所・希望設置場所)</p></td>
<td>
<div class="fill v4">
{% for key,val in form.construction_outdoor_07.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.construction_outdoor_07.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_outdoor_07.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "その他" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に必要になった場合、追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
{{ form_widget(form.construction_outdoor_07_price) }}
</div>
{{ form_errors(form.construction_outdoor_07) }}
</td>
</tr>
{% endif %}
<tr class="content-1">
<td><p>室外機の設置方法(既設方法・希望設置方法)</p></td>
<td>
<div class="fill v4">
{% for key,val in form.setting_install_method.vars.choices %}
<label class="form-check">
<input type="radio" name="{{ form.setting_install_method.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.setting_install_method.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
</label>
{% endfor %}
</div>
{{ form_errors(form.setting_install_method) }}
<div class="fill v4 construction_method_07_v1" style="margin-left: 2rem; flex-direction: column;">
{% for key,val in form.construction_method_07_v1.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.construction_method_07_v1.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_method_07_v1.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "⑧不明(記載)" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に必要になった場合、追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
<img style="margin-top: 3rem;" src="{{ asset('assets/img/form-0y/install-option.jpg') }}" alt="">
{{ form_widget(form.construction_method_07_v1_price) }}
</div>
{{ form_errors(form.construction_method_07_v1) }}
<div class="fill v4 construction_method_07_v2" style="margin-left: 2rem; flex-direction: column;">
{% for key,val in form.construction_method_07_v2.vars.choices %}
<label class="form-check flex">
<input type="radio" name="{{ form.construction_method_07_v2.vars.full_name }}" data-price="{{ val.attr['price'] | default(0) }}" value="{{ val.value }}" {% if form.construction_method_07_v2.vars.data == val.value %}checked{% endif %} />
{{ val.label | trans }}
{% if val.value == "⑧不明(記載)" %}
<p style="padding-left: 2rem;font-size: 0.8em;line-height: 1.3; flex: 1;">※工事当日に必要になった場合、追加費用が発生する場合があります。</p>
{% endif %}
</label>
{% endfor %}
<img style="margin-top: 3rem;" src="{{ asset('assets/img/form-0y/install-option.jpg') }}" alt="">
{{ form_widget(form.construction_method_07_v2_price) }}
</div>
{{ form_errors(form.construction_method_07_v2) }}
</td>
</tr>
</table>
<div class="result">
<p>概算合計金額</p>
<p id="total-price">00,000円</p>
{{ form_widget(form.construction_base_price_1) }}
{{ form_widget(form.construction_base_price_2) }}
{{ form_widget(form.construction_base_price_3) }}
{{ form_widget(form.construction_total_price) }}
{{ form_widget(form.construction_discount) }}
</div>
<div style="text-align: right;" class="pc">
「
本体価格 <span class="product_price"></span>円、
標準工事 <span class="base_price"></span>円、
追加工事 <span class="add_price"></span>円
」
</div>
<div style="text-align: right;" class="sp">
本体価格 <span class="product_price" style="display: inline-block; width: 100px; text-align: right;"></span>円<br>
標準工事 <span class="base_price" style="display: inline-block; width: 100px; text-align: right;"></span>円<br>
追加工事 <span class="add_price" style="display: inline-block; width: 100px; text-align: right;"></span>円
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="check">
<input type="checkbox" name="" id="" required="true">
<label for=""><a href="{{ url('help_privacy') }}" target="_blank">「プライバシーポリシー」</a>に同意する</label>
</div>
</div>
<div class="list-btn">
<button type="button" class="btn btn-sd btn-back" id="btn-back">
<span>戻る</span>
</button>
<button type="submit" class="btn btn-sd" id="btn-confirm" name="mode" value="confirm">
<span>次へ</span>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{% endblock %}