@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* メインビジュアルタイトルのフォントサイズ調整 */
.p-mainVisual__slideTitle {
    font-size: 3rem;      /* PC表示 */
    line-height: 1.2;
    font-weight: 700;     /* 太字 */
    text-align: center;   /* 中央寄せ */
}

/* タブレット表示 */
@media (max-width: 1024px) {
    .p-mainVisual__slideTitle {
        font-size: 2.5rem;
    }
}

/* スマホ表示 */
@media (max-width: 768px) {
    .p-mainVisual__slideTitle {
        font-size: 2rem;
    }
}

/* ==========================
   見出し 共通設定
   ========================== */

.wp-block-heading {
  position: relative;
  padding-bottom: 14px;
}

/* ==========================
   h2 装飾（共通）
   ========================== */

h2.wp-block-heading::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 56px;
  height: 1px;
  background-color: #bc002d;
}

/* ==========================
   h3 装飾（トップページのみ）
   ========================== */

#body_wrap.home h3.wp-block-heading::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #e0e0e0;
}

/* ==========================
   下層ページ（左揃え・論理重視）
   ========================== */

#body_wrap:not(.home) .wp-block-heading {
  text-align: left;
}

/* 下層ページ：h2 赤ラインは左寄せ */
#body_wrap:not(.home) h2.wp-block-heading::after {
  left: 0;
  transform: none;
}

/* 下層ページ：h3の余白調整（結論用） */
#body_wrap:not(.home) h3.wp-block-heading {
  margin-top: 1.2em;
  margin-bottom: 0.6em;
}

/* 下層ページ：h3 を一段小さくする　*/
#body_wrap:not(.home) h3.wp-block-heading {
  font-size: 1.25em;
}

/* ==========================
   下層ページ：h3 薄グレー左縦ライン
   ========================== */

#body_wrap:not(.home) h3.wp-block-heading {
  position: relative;
  padding-left: 14px;
}

#body_wrap:not(.home) h3.wp-block-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 2px;
  height: 1.2em;
  background-color: #bdbdbd;
}


/* ==========================
   トップページ（中央揃え・印象重視）
   ========================== */

#body_wrap.home .wp-block-heading {
  text-align: center;
}

/* トップページ：h2 赤ライン中央 */
#body_wrap.home h2.wp-block-heading::after {
  left: 50%;
  transform: translateX(-50%);
}

/* トップページ：h3 グレーライン中央 */
#body_wrap.home h3.wp-block-heading::after {
  left: 50%;
  transform: translateX(-50%);
}

/* --- コンタクトフォーム 横並び対応（完全版） --- */

/* テーブル全体 */
.contact-table {
    width: 100%;
    max-width: 750px;
    margin: 0 auto 20px auto;
    border-collapse: collapse;
    border: none;
}

/* ラベル・セル */
.contact-table th,
.contact-table td {
    border: none;
    padding: 8px 0;
    vertical-align: top;
}

/* ラベル */
.contact-table th {
    text-align: left;
    width: 220px; /* 左ラベル列幅 */
    font-weight: bold;
    background-color: transparent; /* 背景を透明に */
}

/* 右入力欄 */
.contact-table td {
    width: calc(100% - 220px); /* ラベル列を引いた残り */
}

/* 入力欄 */
.contact-table input.wpcf7-text,
.contact-table input.wpcf7-email,
.contact-table input.wpcf7-tel,
.contact-table textarea.wpcf7-textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 0.95rem;
}

/* お問い合わせ詳細 */
.contact-table textarea.wpcf7-textarea[name="your-message"] {
    height: 250px;
}

/* その他テキストエリア */
.contact-table textarea.wpcf7-textarea:not([name="your-message"]) {
    height: 120px;
}

/* 必須マーク */
.red {
    color: #bc002d;
    font-weight: bold;
    margin-left: 5px;
}

/* 必須注釈 */
.required-note {
    color: #bc002d;
    font-weight: bold;
    margin-bottom: 20px;
}

/* --- テーブル外の同意チェックボックス・送信ボタン --- */
.form-footer {
    text-align: center; /* 中央寄せ */
    margin-top: 20px;
}

.form-footer .acceptance {
    display: block;
    margin-bottom: 20px;
    font-size: 0.95rem;
}

.form-footer .submit-button input.wpcf7-submit {
    background-color: #bc002d;
    color: #fff;
    padding: 12px 0;
    font-size: 1rem;
    font-weight: bold;
    border: none;
    cursor: pointer;
    width: 55%;          /* PC幅 */
    max-width: 300px;    /* 最大幅 */
    border-radius: 4px;
    display: inline-block;
    transition: background-color 0.3s;
}

.form-footer .submit-button input.wpcf7-submit:hover {
    background-color: #8a0021;
}

/* --- レスポンシブ（スマホ） --- */
@media screen and (max-width: 600px) {
    /* テーブル全体 */
    .contact-table {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

    /* セルを縦並びに */
    .contact-table th,
    .contact-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 10px;
    }

    /* 入力欄もフル幅 */
    .contact-table input.wpcf7-text,
    .contact-table input.wpcf7-email,
    .contact-table input.wpcf7-tel,
    .contact-table textarea.wpcf7-textarea {
        width: 100%;
    }

    /* 送信ボタンもフル幅 */
    .form-footer .submit-button input.wpcf7-submit {
        width: 100%;
        max-width: none;
    }
}

/* Simple Sitemap デザイン調整（レスポンシブ対応） */
.simple-sitemap-container {
    background-color: #f7f7f7; /* LPフッターに合わせた薄グレー背景 */
    padding: 40px 20px;
    border-radius: 8px; /* 角を丸める */
}

.simple-sitemap-container ul {
    list-style-type: none; /* デフォルトのリストマークを消す */
    padding-left: 0;
}

.simple-sitemap-container li {
    margin-bottom: 12px; /* 各リンクの間隔 */
}

.simple-sitemap-container a {
    color: #bc002d; /* LPメインカラー */
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
}

.simple-sitemap-container a:hover {
    color: #ff0000; /* ホバー時に少し明るく */
    text-decoration: underline;
}

/* 階層がある場合の調整 */
.simple-sitemap-container ul ul {
    padding-left: 20px; /* サブリストを少しインデント */
}

/* 見出し調整 */
.simple-sitemap-container h3 {
    font-weight: 700;
    margin-top: 30px;
    margin-bottom: 15px;
    color: #333;
    font-size: 1.2rem;
}

/* レスポンシブ：タブレット */
@media (max-width: 1024px) {
    .simple-sitemap-container {
        padding: 30px 15px;
    }
    .simple-sitemap-container h3 {
        font-size: 1.1rem;
    }
}

/* レスポンシブ：スマホ */
@media (max-width: 768px) {
    .simple-sitemap-container {
        padding: 20px 10px;
    }
    .simple-sitemap-container h3 {
        font-size: 1rem;
    }
    .simple-sitemap-container li {
        margin-bottom: 10px;
    }
}

/* ツールチップ（吹き出し） */
.tiktok-link {
    position: relative;
    cursor: pointer;
}

/* 吹き出し本体 */
.tiktok-link::after {
    content: "アプリでご確認いただけます";
    position: absolute;
    bottom: 125%;           /* 上に表示 */
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0,0,0,0.85);
    color: #fff;
    padding: 6px 10px;
    border-radius: 6px;
    white-space: nowrap;
    font-size: 12px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s, transform 0.2s;
    z-index: 999;
}

/* 吹き出しの三角 */
.tiktok-link::before {
    content: "";
    position: absolute;
    bottom: 115%; /* 本体の下辺より少し下 */
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: rgba(0,0,0,0.85) transparent transparent transparent;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 999;
}

/* ホバー・フォーカス時に表示 */
.tiktok-link:hover::after,
.tiktok-link:hover::before,
.tiktok-link:focus::after,
.tiktok-link:focus::before,
.tiktok-link.active::after,
.tiktok-link.active::before {
    opacity: 1;
    transform: translateX(-50%) translateY(-5px);
}

/* スマホ（幅768px以下）は非表示 */
@media (max-width: 768px) {
    .tiktok-link::after,
    .tiktok-link::before {
        display: none;
    }
}


