@charset "UTF-8";
/*
Theme Name: Blockbase Child
Theme URI: https://wordpress.com/theme/blockbase
Author: Automattic
Author URI: https://automattic.com/
Description: Blockbase is a simple theme that supports full-site editing. It comes with a set of minimal templates and design settings that can be manipulated through Global Styles. Use it to build something beautiful.
Requires at least: 6.1
Tested up to: 6.1
Requires PHP: 5.7
Description: Blockbase Child Theme
Template: blockbase
Tags: e-commerce
Version: 3.1.21
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: blockbase Child
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, theme-options, threaded-comments, translation-ready, wide-blocks, style-variations

Blockbase WordPress Theme, (C) 2021 Automattic, Inc.
Blockbase is distributed under the terms of the GNU GPL.

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
*/
/*******************************************************************/
/* cntact form 7 の表示用にCSSを追加 */
/*******************************************************************/
input[name=your-Lname]{width:30%;}
input[name=your-Fname]{width:30%;}
input[name=tan-Lname]{width:30%;}
input[name=tan-Fname]{width:30%;}
input[name=your-Lname-yomi]{width:30%;}
input[name=your-Fname-yomi]{width:30%;}
input[name=your-name]{width:70%;}
input[name=tan-tel]{width:70%;}
input[name=zip]{width:40%;}
input[name=pref]{width:40%;}
input[name=city]{width:60%;}
input[name=addr]{width:100%;}
input[name=com_name]{width:100%;}
input[name=your-tel]{width:70%;}
input[name=your-fax]{width:70%;}
input[name=number-of-workers]{width:10%;}
input[name=your-email]{width:70%;}
input[name=your-email_spare]{width:70%;}
input[name=your-subject]{width:90%;}
input[name=bank_code]{width:30%;}
input[name=branch_code]{width:30%;}
input[name=bank_name]{width:30%;}
input[name=branch_name]{width:30%;}
input[name=number-005]{width:30%;}
.my-msg{width:90%;}
input[type=submit]{
    width:80px;font-size:14px;text-align:center;font-weight:bold;color: #666666;
    border-radius:5px;box-shadow:2px 2px #666666;}
@media screen and (min-width: 768px) {
    input[name=car_name]{width:100%;}
    input[name=com_name]{width:99%;}
    input[name=user_address]{width:100%;}
    input[name=account_number]{width:50%;}
    input[name=account_name]{width:100%;}
    input[name=your-Lname]{width:20%;}
    input[name=your-Fname]{width:20%;}
    input[name=tan-Lname]{width:20%;}
    input[name=tan-Fname]{width:20%;}
    input[name=your-Lname-yomi]{width:20%;}
    input[name=your-Fname-yomi]{width:20%;}
    input[name=your-name]{width:60%;}
    input[name=zip]{width:40%;}
    input[name=pref]{width:40%;}
    input[name=city]{width:50%;}
    input[name=addr]{width:99%;}
    input[name=your-tel]{width:60%;}
    input[name=tan-tel]{width:60%;}
    input[name=your-fax]{width:60%;}
    input[name=number-of-workers]{width:10%;}
    input[name=your-email]{width:60%;}
    input[name=your-email_spare]{width:60%;}
    input[name=your-subject]{width:90%;}
    input[name=bank_code]{width:20%;}
    input[name=branch_code]{width:20%;}
    /* input[name=bank_name]{width:20%;} */
    /* input[name=branch_name]{width:20%;} */
    input[name=number-005]{width:30%;}
    .my-msg{width:90%;}
    input[type=submit]{
        width:80px;font-size:14px;text-align:center;font-weight:bold;color: #666666;
        border-radius:5px;box-shadow:2px 2px #666666;}
}

body {
    font-family: 'M PLUS 1p', sans-serif;
}

#wpcf7-f23-p577-o1 .radio-button-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 24px;
  row-gap: 18px;
  max-width: 600px;
  margin-bottom: 32px;
  box-sizing: border-box;
}

#wpcf7-f23-p577-o1 .radio-button-group label {
  width: 280px;
  height: 120px;
  border: 1px solid #243980;
  border-radius: 16px;
  cursor: pointer;
  font-size: 18px;
  color: #243980;
  background-color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  box-sizing: border-box;
}

/* .wpcf7 .radio-button-group input[type="radio"] {
  display: none;
} */

#wpcf7-f23-p577-o1 .radio-button-group .disabled {
  border-color: #ccc;
  background-color: #f0f0f0;
  color: #999;
  cursor: not-allowed;
}

#wpcf7-f23-p577-o1 .radio-button-group label span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 14px;
  box-sizing: border-box;
}

#wpcf7-f23-p577-o1 .radio-button-group .wpcf7-list-item {
  margin-bottom: 18px;
}

/* .wpcf7 input[type="radio"] {
  display: none;
} */

/* seminarページのフォーム（wpcf7 id=23 / page id=577）だけ radio を非表示にする */
#wpcf7-f23-p577-o1 .radio-button-group input[type="radio"],
#wpcf7-f23-p577-o1 .radio-button-group input[type="checkbox"]{
  display: none;
}

#wpcf7-f23-p577-o1 input[type="radio"]:checked + span,
#wpcf7-f23-p577-o1 .radio-button-group input[type="checkbox"]:checked + span {
  background-color: #243980;
  color: #fff;
}

/* モバイル対応 */
@media (max-width: 654px) {
    #wpcf7-f23-p577-o1 .radio-button-group {
      justify-content: center;  /* ラベルを中央に並べる */
    }

    #wpcf7-f23-p577-o1 .radio-button-group label {
      width: 300px;    /* 幅は固定 */
      height: 80px;    /* 高さをモバイル用に */
    }
}

input.wpcf7-submit {
  width: 360px;
  height: 45px;
  background-color: #e60000; /* 鮮やかな赤 */
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

input.wpcf7-submit:hover {
  background-color: #cc0000; /* ホバー時に少し暗い赤 */
}

/* モバイル対応 */
@media (max-width: 654px) {
    input.wpcf7-submit {
      width: 100%;
      height: 60px;
    }
}

/* テキスト入力欄のデザイン */
.wpcf7-form-control.wpcf7-text {
  border-radius: 8px; /* 入力欄の角を丸める */
  padding: 10px;
  border: 1px solid #ccc;
  font-size: 16px;
}

/* セレクト欄のデザイン */
.wpcf7-form-control.wpcf7-select  {
  border-radius: 8px; /* 入力欄の角を丸める */
  padding: 10px;
  border: 1px solid #ccc;
  font-size: 16px;
}

/* テキストエリアのデザイン */
.wpcf7-form-control.wpcf7-textarea {
  border-radius: 8px; /* 角を丸める */
  padding: 10px;
  border: 1px solid #ccc;
  font-size: 16px;
  resize: vertical; /* 縦方向のリサイズは許可（必要に応じて変更可） */
}

.wpcf7-form-control.wpcf7-number {
  border-radius: 8px;  /* 角を丸くする */
  padding: 10px;
  border: 1px solid #ccc;
  font-size: 16px;
}

/* 「.item」とその直後のpタグの間隔を狭くする */
.item {
  margin-bottom: 4px; /* ラベルの下の余白を狭く */
}

.item + p {
  margin-top: 0; /* 入力欄の上の余白をゼロに */
}

#base-price {
  font-size: 16px;
  border-radius: 6px;
  padding: 4px;
  border: 1px solid #ccc;
  width: 150px; /* 任意で調整可能 */
  height: 38px;
}

.acf-total-display {
  font-size: 30px;
  color: blue;
  font-weight: bold;
}

.acf-fixed-wrapper {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: white;
  border-top: 1px solid #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
  font-size: 16px;
  transition: transform 0.3s ease; /* ← これを必ず入れて */
}

 .kitchen-form input.wpcf7-submit {
  background-image: url('https://www.craftbase.click/wp-content/uploads/セミナーHPNew最新-20_0.png'); /* ←画像URLに置き換え */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
  color: transparent;
  border: none;
  outline: none;
  box-shadow: none;
  border-radius: 0;
  width: 360px;
  height: 100px;
  font-size: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  transition: none;
  display: block;
}

/* モバイル対応（画面幅が768px以下のとき） */
@media screen and (max-width: 768px) {
  .kitchen-form input.wpcf7-submit {
    width: 100%;
    height: auto;
    aspect-ratio: 360 / 100; /* アスペクト比維持（画像が横360×縦100のとき） */
  }
}

.gmap_wrapper {
  position: relative;
  width: 100%;
  max-width: 620px;
  overflow: hidden; /* はみ出し防止 */
}

.gmap_iframe {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  border: 0;
  display: block;
}

.wp-block-template-part{
  background-color: #000f5b;
  color: white;
  padding: 15px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  flex-direction: row; /* 横並びに変更 */
  flex-wrap: wrap;
  text-align: center;
}

.site-footer-container .wp-block-group {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.wp-block-group .is-layout-flow .wp-block-group-is-layout-flow {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.footer-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;  /* ← 左寄せに変更 */
  gap: 0.5px;
  text-align: left;         /* テキストも左揃え */
}

.footer-logo {
  max-width: 190px;
  height: 30px;
}

.footer-links a {
  margin: 0 1px;
  color: white;
  text-decoration: none;
	font-size: 15px;
}

.footer-links a:hover {
  text-decoration: underline;
}

.footer-left .copyright {
  font-size: 12px;
  color: white;
  margin-top: 1px;
}

.footer-right {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
}

.social-item {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: white;
  font-size: 12px;
  white-space: nowrap;
}

.social-item img {
  height: 50px;
  width: auto;
}

/* YouTubeだけ小さい */
.social-item.youtube img {
  height: 30px;
}

/* TikTok / YouTube / Topの親ラッパー */
.social-icons {
  display: flex;
  flex-direction: row;
  gap: 15px;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
}

/* モバイル表示 */
@media screen and (max-width: 768px) {
  .wp-block-template-part {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
  }

  .footer-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
  }

  .social-icons {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 15px;
    width: 100%;
  }

  .social-icons .social-item {
    width: auto;
    flex-shrink: 0;
  }

  .social-item.line {
    order: 2;
    justify-content: center;
  }

  .social-item.line span {
    font-size: 14px;
    white-space: nowrap;
  }
}

.wpcf7 input[type="submit"]:disabled {
  cursor: not-allowed;
  background-color: #ccc;
}

.sma{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:640px) {
    .sma{
        display: block;
    }
}

.reds{
    color:#cc0000;
    font-size:13px;
}

/* Contact Form 7 フォームID 1063 専用のスタイル */
#wpcf7-f1063-p1064-o1 h1 {
  white-space: nowrap;        /* 折り返さない */
  /* font-size: clamp(1rem, 6vw, 2rem); /* 画面幅に応じて自動縮小 */ */
  text-align: center;         /* 任意：中央揃え */
  overflow: hidden;
}

#wpcf7-f1063-p1064-o1 h2 {
  white-space: nowrap;        /* 折り返さない */
  /* font-size: clamp(1rem, 6vw, 2rem); /* 画面幅に応じて自動縮小 */ */
  text-align: center;         /* 任意：中央揃え */
  overflow: hidden;
}

/* スマホ表示時のみ、フォームID 1063 の h1 を折り返さず縮小表示 */
@media screen and (max-width: 768px) {
  #wpcf7-f1063-p1064-o1 h1 {
    white-space: nowrap;                  /* 折り返し防止 */
    font-size: clamp(1rem, 6vw, 1.8rem);  /* スマホ幅に応じて自動縮小 */
    text-align: center;                   /* 任意：中央揃え */
    overflow: hidden;                     /* はみ出し防止 */
  }

  #wpcf7-f1063-p1064-o1 h2 {
    white-space: nowrap;                  /* 折り返し防止 */
    font-size: clamp(1rem, 6vw, 1.8rem);  /* スマホ幅に応じて自動縮小 */
    text-align: center;                   /* 任意：中央揃え */
    overflow: hidden;                     /* はみ出し防止 */
  }
}

/* 全ての入力項目を親要素の幅に収める */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
    max-width: 100%;        /* 画面からはみ出さないように制限 */
    box-sizing: border-box; /* パディングを含めた幅計算にする */
}
/* フォントサイズを16px以上に設定してズームを防ぐ */
input, textarea, select {
    font-size: 16px;
}

/* ===== Android LINE 内蔵ブラウザ用フォールバックドロップダウン =====
   ネイティブの <select> / <input type="date"> が開かない問題への代替 UI */
.kzmz-line-dropdown-overlay {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0;
    background: rgba(0,0,0,0.5);
    display: flex; align-items: flex-end; justify-content: center;
    z-index: 2147483647;
    opacity: 1;
}
.kzmz-line-dropdown {
    background: #fff; border-radius: 12px 12px 0 0;
    width: 100%; max-width: 480px; max-height: 70vh; overflow-y: auto;
    box-shadow: 0 -8px 24px rgba(0,0,0,0.2);
}
.kzmz-line-dropdown-header {
    padding: 12px 16px; font-size: 14px; color: #6b7280;
    border-bottom: 1px solid #e5e7eb; text-align: center;
}
.kzmz-line-dropdown-item {
    padding: 14px 16px; border-bottom: 1px solid #f3f4f6;
    font-size: 16px; cursor: pointer; color: #1f2937;
}
.kzmz-line-dropdown-item.selected { background: #dbeafe; color: #1e40af; font-weight: 600; }
.kzmz-line-dropdown-item:active   { background: #f3f4f6; }
.kzmz-line-dropdown-cancel {
    padding: 14px 16px; text-align: center; font-size: 15px;
    color: #6b7280; border-top: 1px solid #e5e7eb; cursor: pointer;
}
