Symfony Profiler

{#
This file is part of EC-CUBE
Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
http://www.ec-cube.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' %}
{% block stylesheet %}
<style>
.question-container {
margin-bottom: 20px;
/*overflow: hidden;*/
}
.question-title {
cursor: pointer;
background-color: #4894CB;
color: white;
padding: 15px 42px 15px 20px;
display: flex;
justify-content: space-between;
align-items: center;
font-weight: bold;
border-bottom: 1px solid #fff;
border-radius: 12px;
position: relative;
}
.question-title::before {
content: "";
width: 2px;
background-color: #fff;
height: 20px;
position: absolute;
right: 23px;
top: 30%;
opacity: 1;
visibility: visible;
transition: 0.25s all;
}
.question-title-show {
border-radius: 12px 12px 0 0;
}
.question-title-show::before {
opacity: 0;
visibility: hidden;
transition: 0.25s all;
}
.question-title::after {
content: "";
width: 2px;
background-color: #fff;
height: 20px;
position: absolute;
right: 23px;
top: 30%;
transform: rotate(90deg);
}
.question-title:hover {
opacity: 0.7;
}
.question-title span {
font-size: 14px;
}
.question-content {
background-color: #f8f9fa;
border-top: 1px solid #eee;
line-height: 1.75;
letter-spacing: 0.08rem;
}
.plus-icon {
font-size: 20px;
line-height: 1;
}
.question-content {
height: 0;
opacity: 0;
visibility: hidden;
transition: 0.25s all;
padding: 0 20px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
margin-bottom: 24px;
border-radius: 0 0 12px 12px;
font-size: 14px;
}
.question-content.show {
height: auto;
opacity: 1;
visibility: visible;
transition: 0.25s all;
padding: 15px 20px;
}
.toggle-icon {
;
/* additional styles if needed */
}
.toggle-icon.collapsed {
content: "+"; /* default state is collapsed (+) */
}
.toggle-icon.expanded {
content: "-"; /* expanded state is (-) */
}
.question-container table {
width: 100%;
border-collapse: collapse;
margin: 0 auto;
}
.question-container thead {
background-color: #f2f2f2;
}
.question-container th,
.question-container td {
border: 1px solid #ccc;
padding: 8px;
text-align: left;
word-wrap: break-word;
font-size: 12px;
}
.question-container th {
background-color: #f9f9f9;
font-weight: bold;
white-space: nowrap;
}
.question-container td {
vertical-align: top;
}
.question-container tr:nth-child(even) {
background-color: #f9f9f9;
}
.question-container tr:hover {
background-color: #e6f7ff;
}
</style>
{% endblock %}
{% block main %}
<div class="ec-role">
<div class="ec-pageHeader">
<h1>{{ 'guide.title'|trans }}</h1>
</div>
<div class="question-container">
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.payment_methods'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.payment_methods_description'|trans|raw }}<br>
<a href="#creditQuestion" onclick="openAnswer(creditQuestion);">{{ 'guide.credit_card_payment_method'|trans }}</a><br>
<a href="#vartialQuestion" onclick="openAnswer(vartialQuestion);">{{ 'guide.virtual_account_bank_transfer'|trans }}</a><br>
<a href="#conveniQuestion" onclick="openAnswer(conveniQuestion);">{{ 'guide.convenience_store_payment'|trans }}</a><br>
<br>
{{ 'guide.subscription_payment_note'|trans|raw }}<br>
{{ 'guide.payment_service_provider_note'|trans|raw }}<br>
</div>
<div class="question-title credit-question" id="creditQuestion" onclick="toggleAnswer(this)">
<span>{{ 'guide.credit_card_payment'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.accepted_credit_cards'|trans }}<br>
{{ 'guide.credit_card_service_description'|trans|raw }}<br>
{{ 'guide.ssl_security'|trans }}<br>
{{ 'guide.cancellation_policy_12hours'|trans }}<br>
{{ 'guide.debit_card_support'|trans }}<br>
<br>
{{ 'guide.card_rejection_notice'|trans|raw }}<br>
{{ 'guide.alternative_payment_suggestion'|trans }}
</div>
<div class="question-title vartial-question" id="vartialQuestion" onclick="toggleAnswer(this)">
<span>{{ 'guide.virtual_account_bank_transfer_prepaid'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.virtual_account_service_description'|trans|raw }}<br>
{{ 'guide.virtual_account_explanation'|trans }}<br>
{{ 'guide.virtual_account_details_email'|trans }}<br>
{{ 'guide.bank_transfer_instructions'|trans }}<br>
{{ 'guide.virtual_account_validity_period'|trans }}<br>
{{ 'guide.shipping_after_payment_confirmation'|trans }}<br>
<br>
{{ 'guide.virtual_account_notes'|trans|raw }}<br>
<br>
{{ 'guide.bank_atm_instructions_title'|trans|raw }}<br>
{{ 'guide.mizuho_bank_instructions'|trans|raw }}<br>
<br>
{{ 'guide.smbc_bank_instructions'|trans|raw }}<br>
<br>
{{ 'guide.mufg_bank_instructions'|trans|raw }}<br>
<br>
{{ 'guide.japan_post_bank_instructions'|trans|raw }}<br>
{{ 'guide.japan_post_direct_note'|trans|raw }}<br>
<br>
{{ 'guide.yokohama_bank_title'|trans|raw }}<br>
{{ 'guide.yokohama_bank_instructions'|trans|raw }}<br>
<br>
{{ 'guide.seven_bank_title'|trans|raw }}<br>
{{ 'guide.seven_bank_instructions'|trans|raw }}<br>
{{ 'guide.seven_bank_supported_banks'|trans|raw }}<br>
<br>
{{ 'guide.atm_compatibility_note'|trans|raw }}
</div>
<div class="question-title conveni-question" id="conveniQuestion" onclick="toggleAnswer(this)">
<span>{{ 'guide.convenience_store_payment_prepaid'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.convenience_store_locations_title'|trans }}<br>
{{ 'guide.convenience_store_locations'|trans }}<br>
{{ 'guide.convenience_payment_info_email'|trans }}<br>
{{ 'guide.cash_only_payment'|trans }}<br>
{{ 'guide.no_payment_fee'|trans }}<br>
{{ 'guide.payment_deadline_10days'|trans }}<br>
{{ 'guide.payment_deadline_10days_shipping'|trans }}<br>
<br>
{{ 'guide.no_cancellation_after_order'|trans }}<br>
<br>
<a href="https://www.epsilon.jp/mb/conv/seven/index.html" target="_blank">{{ 'guide.seven_eleven_payment_link'|trans }}</a><br>
<a href="https://www.epsilon.jp/mb/conv/lawson/index.html" target="_blank">{{ 'guide.lawson_ministop_payment_link'|trans }}</a><br>
<a href="https://www.epsilon.jp/mb/conv/famima/index.html" target="_blank">{{ 'guide.familymart_payment_link'|trans }}</a><br>
<a href="https://www.epsilon.jp/mb/conv/seico/index.html" target="_blank">{{ 'guide.seicomart_payment_link'|trans }}</a><br>
</div>
<div id="deliver" class="question-title deliver_question" onclick="toggleAnswer(this)">
<span>{{ 'guide.shipping_fee_about'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.yamato_delivery_service'|trans }}<br>
{{ 'guide.shipping_fee_auto_calculation'|trans }}<br>
{{ 'guide.compact_delivery_for_pouch'|trans }}<br>
{{ 'guide.free_shipping_over_5000'|trans }}<br>
{{ 'guide.subscription_free_shipping'|trans }}<br>
<br>
{{ 'guide.no_remote_island_surcharge'|trans }}<br>
<br>
<p>{{ 'guide.compact_delivery_shipping_fee'|trans }}</p>
<table>
<thead>
<tr>
<th>{{ 'guide.region'|trans }}</th>
<th>{{ 'guide.region_detail'|trans }}</th>
<th>{{ 'guide.shipping_fee_tax_included'|trans }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ 'guide.hokkaido_region'|trans }}</td>
<td>{{ 'guide.hokkaido_prefecture'|trans }}</td>
<td>¥880</td>
</tr>
<tr>
<td>{{ 'guide.tohoku_region'|trans }}</td>
<td>{{ 'guide.tohoku_prefectures'|trans }}</td>
<td>¥440</td>
</tr>
<tr>
<td>{{ 'guide.kanto_region'|trans }}</td>
<td>{{ 'guide.kanto_prefectures'|trans|nl2br }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.shinetsu_region'|trans }}</td>
<td>{{ 'guide.shinetsu_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.hokuriku_region'|trans }}</td>
<td>{{ 'guide.hokuriku_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.chubu_region'|trans }}</td>
<td>{{ 'guide.chubu_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.kansai_region'|trans }}</td>
<td>{{ 'guide.kansai_prefectures'|trans }}</td>
<td>¥220</td>
</tr>
<tr>
<td>{{ 'guide.shikoku_region'|trans }}</td>
<td>{{ 'guide.shikoku_prefectures'|trans }}</td>
<td>¥220</td>
</tr>
<tr>
<td>{{ 'guide.chugoku_region'|trans }}</td>
<td>{{ 'guide.chugoku_prefectures'|trans }}</td>
<td>¥220</td>
</tr>
<tr>
<td>{{ 'guide.kyushu_region'|trans }}</td>
<td>{{ 'guide.kyushu_prefectures'|trans|nl2br }}</td>
<td>¥220</td>
</tr>
<tr>
<td>{{ 'guide.okinawa_region'|trans }}</td>
<td>{{ 'guide.okinawa_prefecture'|trans }}</td>
<td>¥660</td>
</tr>
</tbody>
</table>
<br>
<p>{{ 'guide.regular_delivery_shipping_fee'|trans }}</p>
<table>
<thead>
<tr>
<th>{{ 'guide.region'|trans }}</th>
<th>{{ 'guide.region_detail'|trans }}</th>
<th>{{ 'guide.shipping_fee_tax_included'|trans }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ 'guide.hokkaido_region'|trans }}</td>
<td>{{ 'guide.hokkaido_prefecture'|trans }}</td>
<td>¥1,650</td>
</tr>
<tr>
<td>{{ 'guide.tohoku_region'|trans }}</td>
<td>{{ 'guide.tohoku_prefectures'|trans }}</td>
<td>¥803</td>
</tr>
<tr>
<td>{{ 'guide.kanto_region'|trans }}</td>
<td>{{ 'guide.kanto_prefectures'|trans|nl2br }}</td>
<td>¥605</td>
</tr>
<tr>
<td>{{ 'guide.shinetsu_region'|trans }}</td>
<td>{{ 'guide.shinetsu_prefectures'|trans }}</td>
<td>¥605</td>
</tr>
<tr>
<td>{{ 'guide.hokuriku_region'|trans }}</td>
<td>{{ 'guide.hokuriku_prefectures'|trans }}</td>
<td>¥440</td>
</tr>
<tr>
<td>{{ 'guide.chubu_region'|trans }}</td>
<td>{{ 'guide.chubu_prefectures'|trans }}</td>
<td>¥440</td>
</tr>
<tr>
<td>{{ 'guide.kansai_region'|trans }}</td>
<td>{{ 'guide.kansai_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.shikoku_region'|trans }}</td>
<td>{{ 'guide.shikoku_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.chugoku_region'|trans }}</td>
<td>{{ 'guide.chugoku_prefectures'|trans }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.kyushu_region'|trans }}</td>
<td>{{ 'guide.kyushu_prefectures'|trans|nl2br }}</td>
<td>¥330</td>
</tr>
<tr>
<td>{{ 'guide.okinawa_region'|trans }}</td>
<td>{{ 'guide.okinawa_prefecture'|trans }}</td>
<td>¥1,001</td>
</tr>
</tbody>
</table>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.product_delivery'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.delivery_address_setting'|trans|raw }}<br>
{{ 'guide.shipping_within_5_days'|trans|raw }}<br>
{{ 'guide.bank_transfer_payment_note'|trans|raw }}<br>
{{ 'guide.delivery_date_not_specified'|trans }}<br>
{{ 'guide.delivery_time_selection'|trans }}<br>
<br>
{{ 'guide.okinawa_remote_area_notice'|trans|raw }}<br>
{{ 'guide.business_day_shipping_only'|trans|raw }}<br>
<br>
<a href="#ecCalendarSec">{{ 'guide.business_calendar_link'|trans }}</a><br>
<a href="#regularDeliverQuestion" onclick="openAnswer(regularDeliverQuestion);">{{ 'guide.subscription_info_link'|trans }}</a><br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.invoice_about'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.invoice_bank_transfer_customers'|trans|raw }}<br>
<br>
{{ 'guide.bank_transfer_info_email_note'|trans|raw }}<br>
{{ 'guide.invoice_download_period'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.delivery_receipt_about'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.delivery_receipt_mypage_access'|trans }}<br>
{{ 'guide.receipt_download_once_only'|trans }}<br>
{{ 'guide.receipt_name_note_change'|trans }}<br>
<br>
{{ 'guide.delivery_receipt_download_period'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.cancellation_about'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.credit_card_cancellation_12hours'|trans }}<br>
<br>
{{ 'guide.bank_transfer_convenience_no_cancellation'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.return_about'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.no_return_hygiene_products'|trans }}<br>
{{ 'guide.defect_exchange_within_month'|trans|raw }}<br>
{{ 'guide.trade_law_reference'|trans|raw }}<br>
<br>
{{ 'guide.contact_inquiry_title'|trans }}<br>
{{ 'guide.contact_email'|trans|raw }}<br>
{{ 'guide.contact_form_available'|trans|raw }}
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.product_not_received_case'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.delivery_refusal_charges'|trans }}
</div>
<div class="question-title question-regularDeliverQuestion" id="regularDeliverQuestion" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_delivery_timing'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.first_delivery_date_title'|trans }}<br>
{{ 'guide.first_delivery_within_5_days'|trans }}<br>
<br>
{{ 'guide.second_delivery_onwards_title'|trans }}<br>
{{ 'guide.subscription_cycle_delivery'|trans }}<br>
{{ 'guide.subscription_cycle_options'|trans }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_payment_method'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.credit_card_payment_available'|trans }}<br>
{{ 'guide.lump_sum_payment_only'|trans }}<br>
{{ 'guide.credit_card_change_deadline'|trans|raw }}
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_shipping_fee'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.subscription_free_shipping_all'|trans }}
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.initial_subscription_cancellation'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.initial_subscription_cancel_12hours'|trans }}<br>
{{ 'guide.cancel_from_order_history'|trans }}<br>
<br>
{{ 'guide.cannot_cancel_from_subscription_list'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_delivery_cycle'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.subscription_cycle_selection'|trans }}<br>
{{ 'guide.delivery_date_selection'|trans }}<br>
<br>
{{ 'guide.subscription_cycle_change_title'|trans }}<br>
{{ 'guide.cycle_change_from_next_next'|trans }}<br>
{{ 'guide.cycle_change_deadline_procedure'|trans }}<br>
<br>
{{ 'guide.next_delivery_cannot_change'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_delivery_time'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.delivery_time_options'|trans }}<br>
<br>
{{ 'guide.delivery_time_change_title'|trans }}<br>
{{ 'guide.delivery_time_change_procedure'|trans }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_delivery_quantity'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.subscription_quantity_up_to_99'|trans }}<br>
<br>
{{ 'guide.subscription_quantity_change_title'|trans }}<br>
{{ 'guide.quantity_change_monthly_usage'|trans }}<br>
{{ 'guide.quantity_change_procedure'|trans }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_next_delivery_skip'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.skip_next_delivery_explanation'|trans }}<br>
{{ 'guide.skip_procedure_deadline'|trans }}<br>
<br>
{{ 'guide.skip_deadline_notice'|trans|raw }}<br>
{{ 'guide.skip_cannot_cancel'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_pause_resume'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.pause_resume_mypage_procedure'|trans }}<br>
<br>
{{ 'guide.subscription_pause_title'|trans }}<br>
{{ 'guide.pause_available_after_first_shipment'|trans }}<br>
{{ 'guide.pause_procedure_deadline'|trans }}<br>
<br>
{{ 'guide.resume_limitation_notice'|trans|raw }}<br>
{{ 'guide.pause_deadline_notice'|trans|raw }}<br>
<br>
{{ 'guide.subscription_resume_title'|trans }}<br>
{{ 'guide.resume_procedure_mypage'|trans }}<br>
{{ 'guide.resume_first_delivery_5days'|trans }}<br>
{{ 'guide.resume_payment_confirmation'|trans|raw }}<br>
{{ 'guide.resume_second_delivery_cycle'|trans }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_contract_cancellation'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.contract_cancellation_deadline'|trans }}<br>
{{ 'guide.cancellation_deadline_15th'|trans }}<br>
{{ 'guide.cancellation_deadline_28th'|trans }}<br>
<br>
{{ 'guide.cancellation_next_next_notice'|trans|raw }}<br>
{{ 'guide.cancellation_cannot_reverse'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_delivery_address_change'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.delivery_address_change_mypage'|trans }}<br>
{{ 'guide.delivery_address_per_subscription'|trans }}<br>
<br>
{{ 'guide.address_change_deadline_procedure'|trans|raw }}<br>
</div>
<div class="question-title" onclick="toggleAnswer(this)">
<span>{{ 'guide.subscription_payment_method_change'|trans }}</span>
<span></span>
</div>
<div class="question-content">
{{ 'guide.credit_card_change_mypage'|trans }}<br>
<br>
{{ 'guide.payment_method_change_deadline'|trans|raw }}<br>
</div>
</div>
</div>
<script>
// ページ読み込み完了後に実行
window.onload = function () { // URLからハッシュ値を取得（例: #deliver）
let hash = window.location.hash;
// ハッシュ値が#deliverの場合、対応するアコーディオンを開く
if (hash === '#deliver') {
let deliverQuestion = document.querySelector('.deliver_question'); // 送料についてのアコーディオンのタイトル要素
if (deliverQuestion) {
toggleAnswer(deliverQuestion);
}
}
};
// アコーディオン自動オープンが必要な要素
let creditQuestion = document.querySelector('.credit-question'); // 送料についてのアコーディオンのタイトル要素
let vartialQuestion = document.querySelector('.vartial-question'); // 送料についてのアコーディオンのタイトル要素
let conveniQuestion = document.querySelector('.conveni-question'); // 送料についてのアコーディオンのタイトル要素
let regularDeliverQuestion = document.querySelector('.question-regularDeliverQuestion');
// 送料についてのアコーディオンのタイトル要素
// アコーディオンオープン
function openAnswer(element) {
let content = element.nextElementSibling;
let icon = element.querySelector("span:last-child");
element.classList.add('question-title-show');
content.classList.add('show');
icon.classList.add('expanded');
icon.classList.add('collapsed');
}
function toggleAnswer(element) {
let content = element.nextElementSibling;
let icon = element.querySelector("span:last-child");
element.classList.toggle('question-title-show');
content.classList.toggle('show');
icon.classList.toggle('expanded');
icon.classList.toggle('collapsed');
}
</script>
{% endblock %}

app/template/default/Help/question.twig line 1