https://reserve-haircolor-fit.com/faq

1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <title>よくある質問 | ヘアカラーFit!</title>
7  <meta name="description" content="ヘアカラーFit! のよくある質問（FAQ）ページです。">
8<!-- Google Tag Manager -->

9<script>

9(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
10new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
11j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
12'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
13})(window,document,'script','dataLayer','

13GTM-PQSXR6FM

13');

13</script>

13
14<!-- End Google Tag Manager -->
15  <link rel="preconnect" href="https://fonts.googleapis.com">
16  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
17  <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap" rel="stylesheet">
18  <link rel="stylesheet" href="css/style.css">
19  <link rel="stylesheet" href="css/pwa.css">
20  <!-- PWA設定 -->
21  <link rel="manifest" href="manifest.json">
22  <meta name="theme-color" content="#F5A623">
23  <meta name="apple-mobile-web-app-capable" content="yes">
24  <meta name="apple-mobile-web-app-status-bar-style" content="default">
25  <meta name="apple-mobile-web-app-title" content="HCFit予約">
26  <link rel="apple-touch-icon" href="images/icon-192.png">
27</head>
28<body>
29<!-- Google Tag Manager (noscript) -->

29
30<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=

30GTM-PQSXR6FM

30"
31height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

32<!-- End Google Tag Manager (noscript) -->
33
34  <!-- 通知許可ダイアログ（PWAインストール済み + お気に入り登録時に表示） -->
35  <div id="notif-permission-dialog">
36    <div class="notif-dialog__box">
37      <div class="notif-dialog__icon">🔔</div>
38      <p class="notif-dialog__title">お気に入り店舗の<br>通知を受け取りますか？</p>
39      <p class="notif-dialog__body">
40        お気に入り登録した店舗のキャンペーンや<br>
41        空き状況などをお知らせします。
42      </p>
43      <div class="notif-dialog__buttons">
44        <button class="notif-dialog__allow-btn">通知を許可する</button>
45        <button class="notif-dialog__later-btn">後で</button>
46      </div>
47    </div>
48  </div>
49
50  <!-- ヘッダー -->
51  <header class="site-header">
52    <div class="site-header__inner">
53      <img
54        class="site-header__logo"
55        src="https://d2xsxph8kpxj0f.cloudfront.net/310519663253768006/k5VUPXUiC7dVWaheSTyz8z/pasted_file_frTBG5_logo_76eede68.webp"
56        alt="ヘアカラー専門店 HAIR COLOR Fit!"
57      >
58    </div>
59  </header>
60
61  <!-- ページタイトル -->
62  <div class="page-title">
63    <div class="page-title__en">FAQ</div>
64    <div class="page-title__ja">よくある質問</div>
65    <div class="page-title__bar"></div>
66  </div>
67
68  <!-- コンテンツ -->
69  <div class="faq-wrap">
70
71    <!-- カテゴリ: 予約について -->
72    <div class="faq-category">

72予約について</div>
73
74    <!-- Q1 -->
75    <div class="faq-item" id="faq-1">
76      <button class="faq-q-btn" onclick="toggleFaq('faq-1')" aria-expanded="false">
77        <span class="q-label">Q</span>
78        <span class="q-text">予約と待ち時間はどうなっているの？</span>
79        <span class="q-arrow">▼</span>
80      </button>
81      <div class="faq-answer">
82        <span class="a-label">A</span>
83        <p>ご予約のお客様が優先となります。
84・web予約をお願いいたします。
85・ご予約なしのお客様は、店頭の受付モニターにてお好きな空き時間枠をお取りください。
86＜待ち時間について＞
87・直接ご来店の場合は、ご予約のお客様が優先となるため、店頭の受付モニターにて最短の空き時間枠をご確認ください。
88・最短の空き時間までお待ちいただく必要がございます。
89・web予約・店頭モニターにて1ヶ月先まで予約を取ることができますので、ご利用いただくと待ち時間が解消されます。
90・ご来店時の時間枠に空きがあれば、待ち時間なしでご利用もできます。</p>
91      </div>
92    </div>
93
94    <!-- Q2 -->
95    <div class="faq-item" id="faq-2">
96      <button class="faq-q-btn" onclick="toggleFaq('faq-2')" aria-expanded="false">
97        <span class="q-label">Q</span>
98        <span class="q-text">電話予約はできますか？</span>
99        <span class="q-arrow">▼</span>
100      </button>
101      <div class="faq-answer">
102        <span class="a-label">A</span>
103        <p>申し訳ございませんが、電話でのご予約は承っておりません。インターネット予約（毛染めの窓口）または店頭の受付モニターをご利用ください。</p>
104      </div>
105    </div>
106
107    <!-- Q3 -->
108    <div class="faq-item" id="faq-3">
109      <button class="faq-q-btn" onclick="toggleFaq('faq-3')" aria-expanded="false">
110        <span class="q-label">Q</span>
111        <span class="q-text">予約なしでも利用できますか？</span>
112        <span class="q-arrow">▼</span>
113      </button>
114      <div class="faq-answer">
115        <span class="a-label">A</span>
116        <p>ご予約なしのお客様は、店頭にて空き時間枠をお取りいただきご利用いただけます。
117ご予約のお客様優先となりますので、長時間の待ち時間がある可能性がございます。ご了承いただけますと幸いです。
118待ち時間はお買い物をお楽しみいただいたり、お時間を有効活用なさってください。</p>
119      </div>
120    </div>
121
122    <!-- Q4 -->
123    <div class="faq-item" id="faq-4">
124      <button class="faq-q-btn" onclick="toggleFaq('faq-4')" aria-expanded="false">
125        <span class="q-label">Q</span>
126        <span class="q-text">予約はできますか？</span>
127        <span class="q-arrow">▼</span>
128      </button>
129      <div class="faq-answer">
130        <span class="a-label">A</span>
131        <p>はい、インターネット（毛染めの窓口）からご予約いただけます。ご来店の1ヶ月前から予約が可能です。各店舗の「インターネットからのご予約はこちら」ボタンよりお進みください。</p>
132      </div>
133    </div>
134
135    <!-- Q5 -->
136    <div class="faq-item" id="faq-5">
137      <button class="faq-q-btn" onclick="toggleFaq('faq-5')" aria-expanded="false">
138        <span class="q-label">Q</span>
139        <span class="q-text">予約時のクーポンの使用方法を教えてください。</span>
140        <span class="q-arrow">▼</span>
141      </button>
142      <div class="faq-answer">
143        <span class="a-label">A</span>
144        <p>クーポンをご利用の場合は、予約画面にてメニューをご選択時、「クーポン使用」にチェックを入れて下さい。
145染め方につきましては、ご来店の際にスタッフにお申しつけ下さい。</p>
146      </div>
147    </div>
148
149    <!-- Q6 -->
150    <div class="faq-item" id="faq-6">
151      <button class="faq-q-btn" onclick="toggleFaq('faq-6')" aria-expanded="false">

152        <span class="q-label">Q</span>
153        <span class="q-text">遅れそうな場合はどこに連絡したらいいですか？</span>
154        <span class="q-arrow">▼</span>
155      </button>
156      <div class="faq-answer">
157        <span class="a-label">A</span>
158        <p>お電話で遅れる対応やキャンセルは承っておりません。
159スマートフォンもしくはパソコンからご予約の変更をして再度ご予約をお取り直しいただくことをお勧めいたします。
160また、5分以上遅れた場合はキャンセルとなる場合がございます。</p>
161      </div>
162    </div>
163	  
164	<!-- Q7 -->
165    <!--<div class="faq-item" id="faq-7">
166      <button class="faq-q-btn" onclick="toggleFaq('faq-7')" aria-expanded="false">
167        <span class="q-label">Q</span>
168        <span class="q-text">店舗のお気に入り登録とは何ですか？</span>
169        <span class="q-arrow">▼</span>
170      </button>
171      <div class="faq-answer">
172        <span class="a-label">A</span>
173        <p>予約ページの各店舗右上のハートマークをタップすると、お気に入り店舗としてブックマークできます。一度登録しておけば、次回以降は検索なしでスムーズにアクセスできるので、とても便利です。</p>
174      </div>
175    </div>-->
176
177  </div><!-- /.faq-wrap -->
178
179  
180
181
182  <!-- インストールカード（Android/PC用） -->
183  <div class="install-card-wrap" id="installCardAndroid" style="display:none;">
184    <div class="install-card">
185      <div class="install-card__icon-wrap">
186        <img src="images/icon-192.png" class="install-card__icon" alt="">
187      </div>
188      <div class="install-card__body">
189        <p class="install-card__title">アプリとして追加</p>
190        <p class="install-card__desc">ホーム画面に追加してすばやく起動</p>
191      </div>
192      <button class="install-card__add-btn" id="installLinkBtn">
193        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>
194        追加
195      </button>
196      <button class="install-card__close-btn" id="installCardCloseAndroid" aria-label="閉じる">×</button>
197    </div>
198  </div>
199
200  <!-- インストールカード（iOS Safari用） -->
201  <div class="install-card-wrap" id="installCardIOS" style="display:none;">
202    <div class="install-card install-card--ios">
203      <div class="install-card__ios-top">
204        <div class="install-card__icon-wrap">
205          <img src="images/icon-192.png" class="install-card__icon" alt="">
206        </div>
207        <div class="install-card__body">
208          <p class="install-card__title">ホーム画面に追加</p>
209          <p class="install-card__desc">アプリとして使えます</p>
210        </div>
211        <button class="install-card__close-btn" id="installCardCloseIOS" aria-label="閉じる">×</button>
212      </div>
213      <ol class="install-card__steps">
214        <li>Safari下部の…をタップ</li>
215		<li>共有ボタン（□↑）をタップ</li>
216        <li>「ホーム画面に追加」を選択</li>
217        <li>右上の「追加」をタップ</li>
218      </ol>
219    </div>
220  </div>
221
222  <!-- フッター -->
223  <footer class="site-footer">
224    <div style="font-weight:700;color:#cccccc;margin-bottom:4px;">ヘアカラーFit!</div>
225    <div>© 2026 ヘアカラー専門店 ヘアカラーFit!</div>
226    <div style="margin-top:6px;"><a href="privacy" style="color:#888888;text-decoration:underline;">プライバシーポリシー</a></div>
227  </footer>
228
229  <!-- 下部ナビゲーション -->
230  <nav class="bottom-nav">
231    <a class="bottom-nav__item" href="https://www.reserve-haircolor-fit.com/">
232      <span class="bottom-nav__label">ご予約</span>
233    </a>
234    <a class="bottom-nav__item" href="howto">
235      <span class="bottom-nav__label">予約方法</span>
236    </a>
237    <a class="bottom-nav__item active" href="faq">
238      <span class="bottom-nav__label">よくある質問</span>
239    </a>
240  </nav>
241
242  

242<script>
243    /* ---- FAQ アコーディオン ---- */
244    function toggleFaq(id) {
245      var item = document.getElementById(id);
246      var btn  = item.querySelector('.faq-q-btn');
247      var isOpen = item.classList.contains('open');
248      item.classList.toggle('open', !isOpen);
249      btn.setAttribute('aria-expanded', String(!isOpen));
250    }
251  </script>

251
252  

252<script src="js/pwa.js"></script>

252
253  

253<script src="js/notif.js"></script>

253
254
255</body>
256</html>