/* **************************************************
 * 共通
 * ************************************************** */


/* サイドバーウィジェット用メニュー
 * PC用 : 1080px以上
 * モバイル用 : 1079px以下
 * --------------------------------------------------
 * synx_postlist_widget-2 : PC用 : 車向けクリーニング
 * synx_postlist_widget-5 : PC用 : 自動車関連サービス
 * synx_postlist_widget-6 : PC用 : 住まい・店舗向けクリーニング
 * synx_postlist_widget-7 : PC用 : 各サービスの出張範囲
 * nav_menu-3 : モバイル用 : メニュー
 */

/* ウィジェットを非表示にするテスト */
/* モバイルで非表示（PCでのみ表示） */
/*
@media screen and (max-width: 1079px) {
	body.postid-17054 #synx_postlist_widget-2.sidebar-widget.widget_synx_postlist_widget, 
	body.postid-17054 #synx_postlist_widget-5.sidebar-widget.widget_synx_postlist_widget, 
	body.postid-17054 #synx_postlist_widget-6.sidebar-widget.widget_synx_postlist_widget, 
	body.postid-17054 #synx_postlist_widget-7.sidebar-widget.widget_synx_postlist_widget {
		display: none !important;
	}
}
*/

/* PCで非表示（モバイルでのみ表示） */
/*
@media screen and (min-width: 1080px) {
	body.postid-17054 #nav_menu-3.sidebar-widget.widget_nav_menu {
		display: none !important;
	}
}
*/

/* 見出しの上下余白を指定 */
.post-content .wp-block-heading {
    margin-top: 2.5em !important;
    margin-bottom: 1em !important;
}
.post-content .wp-block-heading:first-child {
    margin-top: 1.5em !important;
}



/* 文字列 */
/* 税込表記 */
.tax-string {
	font-size: 0.8em;
}
/* 円表記 */
.yen-string {
	font-size: 0.85em;
    margin-left: 2px;
}


/* フッター上部ウィジェットの余白を多めに設定
 * （投稿ランキングの左上丸数字の欠けを防ぐ）
 * ※14px以下で欠ける */
.ftrhead-widget {
    padding-left: 16px !important;
}


/* 列のthをヘッダ行のthと同じデザインに変更 */
html :where(.post-content) .synx-tbl th, 
html :where(.post-content) .wp-block-table th {
    color: #fff;
    background: var(--color-main);
    border-bottom: inherit;
}

html :where(.post-content) .synx-tbl td, 
html :where(.post-content) .synx-tbl th, 
html :where(.post-content) .wp-block-table td, 
html :where(.post-content) .wp-block-table th {
    border: 1px solid color-mix(in srgb, var(--color-text) 10%, var(--color-background));
    border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-background));
}


/* --------------------------------------------------
 * ボタン
 * -------------------------------------------------- */

/* ボタン共通設定 */
.common-btn,
.pack-btn {
    padding: 12px 15px;
    text-align: center;
    text-decoration: none;
    font-size: 1.05em;
    font-weight: 400;
    border-radius: 50px;
    transition: background-color 0.2s ease, transform 0.1s ease;
    box-sizing: border-box;
}
.common-btn:active,
.pack-btn:active {
    transform: scale(0.98);
}

/* 共通ボタン（白抜き） */
.common-btn {
    display: inline-block;
    border: 3px solid #666;
    padding: 12px 15px;
    padding: 15px 5px;
    margin: 8px 4px;
    margin: 0;
    background: #fff;
    color: #333;
}
.common-btn:hover {
    background: #9cbbe2;
    background: rgb(0 54 107 / 0.1);
    color: #1a3b60;
}
.common-btn:active {
    transform: scale(0.98);
}

/* ボタン内部・本体 */
.common-btn-body {
    display: flex;
    gap: 1px;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* ボタン内部・左右Icon部 */
.common-btn-body .left-icon,
.common-btn-body .right-icon {
    width: 1em;
    display: block;
    font-size: 18px;
}
.common-btn-body .left-icon::before,
.common-btn-body .left-icon::after,
.common-btn-body .right-icon::before {
    content: "";
}
.common-btn-body .right-icon::after {
    content: "\f054";
    /*
    font-family: "Font Awesome 5 Free";
    */
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/* ボタン内部・左右Icon部　Icon無しVer */
.common-btn-body.no-icon .left-icon::before,
.common-btn-body.no-icon .left-icon::after,
.common-btn-body.no-icon .right-icon::before,
.common-btn-body.no-icon .right-icon::after {
    content: "";
}

/* ボタン枠線を標準色にする */
a.common-btn.common-btn-standard {
    border-color: var(--karen-button-common-border-color);
}

a.common-btn.common-btn-standard .common-btn-body.title-underline .karen-button-title {
    padding-bottom: 5px;
    border-bottom: 1px solid var(--karen-button-common-border-color);
}


/* ボタン内部・タイトル部 */
.common-btn-body .center-title {
    display: flex;
    gap: 7px;
/*    flex-wrap: nowrap;*/
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* ボタン内部・タイトル部　タイトル・サブタイトル */
.common-btn-body .karen-button-title,
.common-btn-body .karen-button-sub-title {
    display: block;
    line-height: 1.0;
/*    text-wrap: nowrap;*/
    padding: 0;
    margin: 0;
}
.common-btn-body .karen-button-title {
    font-size: 1.1em;
    font-weight: 700;
}
.common-btn-body .karen-button-sub-title {
    font-size: 0.8em;
    font-weight: 400;
}

/* タイトル文字太さ・通常 */
.common-btn-body.std-font-weight .karen-button-title {
    font-weight: 400;
}

/* タイトル・下線あり */
.common-btn-body.title-underline .karen-button-title {
    padding-bottom: 5px;
    border-bottom: 1px solid #999;
}

@media (max-width: 450px) {
    .common-btn-body .karen-button-title {
        font-size: 1.0em;
    }
    .common-btn-body .karen-button-sub-title {
        font-size: 0.7em;
    }
}



/* ************************************************** 
 * クエリーループをカスタマイズ
 * クエリーループの追加classにquery-loop-blogを追加する
 * ************************************************** */

/* グリッド内の設定 */
.query-loop-blog .wp-block-post {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* カードごとの設定 */
.query-loop-blog .wp-block-group {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 0px;
    border-radius: 15px 0;
    box-shadow: 1px 1px 5px #ddd;
    position: relative;
}

/* アイキャッチ画像の余白調整 */
.query-loop-blog .wp-block-post-featured-image {
    margin: 0 !important;
}
.query-loop-blog .wp-block-post-featured-image a img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center;
    border-radius: 13px 0 0 0;
}

/* タイトルの余白調整（日付と上左右を合わせる） */
.query-loop-blog .wp-block-post-title {
    margin: 15px 15px 20px 15px !important;
    font-weight: 700;
    font-size: 1.0em;
    line-height: 1.3 !important;
    border: none !important;
}
.query-loop-blog .wp-block-post-title a, 
.query-loop-blog .wp-block-post-title a:link {
	color: #000 !important;
}

/* 日付の余白調整（タイトルと下左右を合わせる） */
.query-loop-blog .wp-block-post-date {
    margin: auto 15px 15px 15px !important;
    text-align: right;
    font-size: 0.85em;
    padding: 0px;
    line-height: 1.1;
    color: #666;
}
.query-loop-blog .wp-block-post-date time {
    margin: 0;
    padding: 0;
    background: #fff;
    line-height: 1.1;
}
.query-loop-blog .wp-block-post-date time::before {
    width: 1em;
    height: 1em;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 3px;
    vertical-align: top;

    content: "\f017";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    color: var(--color-main);
}

/* タグブロック全体をアイキャッチ画像の左上に配置 */
.query-loop-blog .wp-block-post-terms__separator {
    display: none !important;
}
.query-loop-blog .taxonomy-post_tag {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 !important;
}

/* タグのリンクを装飾 */
.query-loop-blog .taxonomy-post_tag a {
    background-color: rgba(0, 0, 0, 0.7);
    color: #ffffff !important;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 4px 10px;
    border-radius: 30px;
    text-decoration: none;
    line-height: 1;
    transition: background-color 0.2s ease;
}
.query-loop-blog .taxonomy-post_tag a:hover {
    background-color: #0073aa;
    background-color: var(--color-main-gradation);
    color: #ffffff !important;
}

/* タグを非表示
 * 複数のタグを設定した投稿の場合、アイキャッチ上がタグで埋まるため */
.query-loop-blog .taxonomy-post_tag {
    display: none !important;
}


/* ************************************************** 
 * 各サービスページ末のCTAエリア
 * ************************************************** */

.simple-cta-container {
    background-color: #f8f9fa;
    border: 5px solid #e2e8f0;
    border-radius: 5px;
    padding: 40px 20px;
    margin: 75px 0 40px 0 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    box-sizing: border-box;
}

.simple-cta-inner {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.simple-cta-title {
    font-size: 1.5em !important;
    font-weight: 700 !important;
    color: #1a202c !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.4 !important;
    border: none !important;
    padding: 0 !important;
}
.phrase-min-block {
    line-height: 1.2 !important;
}

.simple-cta-lead {
    font-size: 15px;
    font-size: 1.1em;
    color: #4a5568;
    margin: 0 0 28px 0;
    line-height: 1.4;
}

.simple-cta-pc-only {
    display: inline;
}

/* -----------------------------------
   ボタン配置（基本: PC用 3列）
----------------------------------- */
.simple-cta-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    justify-items: center;
    align-items: stretch;
}

.simple-cta-btn {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 7px 7px;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
    border-radius: 10px;
}
.simple-cta-btn:hover {
    transform: translateY(2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
    opacity: 0.95;
}

.simple-cta-btn-subtext {
    font-size: 0.9em;
    font-weight: 700;
    margin: 0;
}

.simple-cta-btn-maintext {
    font-size: 1.15em;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 3px;
    margin: 0;
    white-space: nowrap;
}
.simple-cta-btn-maintext i {
    font-size: 1.15em;
}

.simple-cta-btn-note {
    font-size: 0.8em;
}

/* 各ボタンの配色 */
.simple-cta-btn-phone, 
.simple-cta-btn-mobile {
    background-color: #ffffff;
    color: #2b6cb0 !important;
    border: 2px solid var(--color-main);
}
.simple-cta-btn-phone .simple-cta-btn-subtext, 
.simple-cta-btn-mobile .simple-cta-btn-subtext { color: #000; }
.simple-cta-btn-phone .simple-cta-btn-maintext, 
.simple-cta-btn-mobile .simple-cta-btn-maintext { color: var(--color-main); }
.simple-cta-btn-phone .simple-cta-btn-note, 
.simple-cta-btn-mobile .simple-cta-btn-note { color: #000; }

.simple-cta-btn-mail {
    background-color: var(--color-main);
    color: #ffffff !important;
    border: 2px solid var(--color-main-gradation-custom);
}
.simple-cta-btn-mail .simple-cta-btn-subtext { color: #fff; }
.simple-cta-btn-mail .simple-cta-btn-maintext { color: #fff; }
.simple-cta-btn-mail .simple-cta-btn-note { color: #fff; }


.simple-cta-btn-mobile .simple-cta-btn-maintext i {
    font-size: 1.3em;
    display: inline-block;
	transform: rotate(0deg);
    margin-right: -3px !important;
}


.simple-cta-btn-note .simple-cta-btn-reception-hours {
    padding: 4px 5px 3px 5px;
    border-radius: 0px;
    line-height: 1;
    border: 1px solid #fff;
    background: var(--color-main);
    color: #fff;
    display: inline-block;
    margin-right: 7px;
}
.simple-cta-btn-mail .simple-cta-btn-note .simple-cta-btn-reception-hours {
    background-color: color-mix(in oklab, #000 25%, var(--color-main));
}

/* -----------------------------------
 * 電話上段、メール下段
----------------------------------- */
@media (max-width: 925px) and (min-width: 551px) {

    .simple-cta-container {
        padding: 25px 20px;
    }
 
    .simple-cta-title {
        font-size: 1.3em;
    }
    .simple-cta-lead {
        font-size: 0.9em;
        margin-bottom: 20px;
    }
    
    .simple-cta-btn-maintext {
        font-size: 1.05em;
    }
    .simple-cta-btn-maintext i {
        font-size: 1.1em;
    }
    .simple-cta-btn-note {
        font-size: 0.8em;
    }

    .simple-cta-buttons {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        max-width: 600px;
        margin: 0 auto;
    }

    .simple-cta-btn-mail {
        grid-column: span 2;
        justify-self: center;
        max-width: 380px;
    }
}

/* -----------------------------------
 * 縦1列
----------------------------------- */
@media (max-width: 550px) {

    .simple-cta-container {
        padding: 20px 15px;
    }
    
    .simple-cta-title {
        font-size: 1.1em;
    }
    
    .simple-cta-lead {
        font-size: 0.8em;
        margin-bottom: 20px;
    }
    
    .simple-cta-pc-only {
        display: none;
    }
    
    .simple-cta-buttons {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .simple-cta-btn {
        max-width: 350px;
        margin: 0 auto;
    }
}

/* タイトル文字を改行 */
@media (max-width: 600px) {
    .phrase-min-block {
        display: inline-block;
    }
}

/* CTA切り替え */
.karen-cta-services,
.karen-cta-faq,
.karen-cta-biz-courses,
.karen-switch-section-services,
.karen-switch-section-faq,
.karen-switch-section-biz-courses {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

.karen-cta-services .karen-switch-section-services {
    display: block;
}
.karen-cta-services .karen-switch-section-faq {
    display: none;
}
.karen-cta-services .karen-switch-section-biz-courses {
    display: none;
}

.karen-cta-faq .karen-switch-section-services {
    display: none;
}
.karen-cta-faq .karen-switch-section-faq {
    display: block;
}
.karen-cta-faq .karen-switch-section-biz-courses {
    display: none;
}

.karen-cta-biz-courses .karen-switch-section-services {
    display: none;
}
.karen-cta-biz-courses .karen-switch-section-faq {
    display: none;
}
.karen-cta-biz-courses .karen-switch-section-biz-courses {
    display: block;
}



/* ************************************************** 
 * 各サービスのギャラリー
 * ************************************************** */

.service-gallery {
    gap: 10px !important;
    margin-top: 10px !important;
    margin-bottom: 50px !important;
}

.service-gallery figcaption {
/*
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 20%) !important;
*/
    background: rgb(0, 0, 0, 0.6) !important;
    text-shadow: 0px 1px 2px #000 !important;
}

@media (max-width: 575px) {

    .service-gallery {
        gap: 20px !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    
    .service-gallery figure.wp-block-image {
        width: 100% !important;
        max-width: 100% !important;
    }
}



/* ************************************************** 
 * YouTube埋め込み
 * ************************************************** */

.youtube-container .youtube-embed {
    width: 100%;
    max-width: 640px;
    aspect-ratio: 16 / 9;
    height: auto;
}



/* ************************************************** 
 * サービスページ
 * ヘッダータイトル
 * ************************************************** */
.page-header-title-container {
    padding: 25px 30px;
    margin: 0 50px 0 0;
    background: rgb(0, 0, 0, 0.6);
    text-shadow: 0px 0px 5px #000;
    display: flex;

    gap: 10px;
    flex-direction: column;
    align-items: left;
    justify-content: center;
    border-top: 3px solid rgb(255, 255, 255, 0.85);
    border-bottom: 3px solid rgb(255, 255, 255, 0.85);
}

.page-header-title-container .page-header-title {
    margin: 0;
    padding: 0;
    color: #fff;
    font-weight: 700;
    font-size: 2.5em;
    line-height: 1;
    text-align: left;
}

.page-header-title-container .page-header-sub-title {
    margin: 0 1.5em;
    padding: 0;
    color: #fff;
    font-weight: 700;
    font-size: 1.6em;
    line-height: 1;
    text-align: left;
}

.page-header-title-container .page-header-desc {
    margin: 0;
    padding: 0;
    color: #fff;
    font-weight: 700;
    font-size: 1.3em;
    line-height: 1.4;
    text-align: left;
}

@media (max-width: 768px) {
    .page-header-title-container {
        padding: 25px 20px;
        margin: 0;
    }
    .page-header-title-container .page-header-title {
        font-size: 2em;
    }
    .page-header-title-container .page-header-sub-title {
        margin: 0 1.2em;
        font-size: 1.6em;
    }
    .page-header-title-container .page-header-desc {
        font-size: 1.2em;
    }
}

@media (max-width: 475px) {
    .page-header-title-container {
        padding: 25px 10px;
    }
    .page-header-title-container .page-header-title {
        font-size: 1.8em;
    }
    .page-header-title-container .page-header-sub-title {
        margin: 0 1.2em;
        font-size: 1.3em;
    }
    .page-header-title-container .page-header-desc {
        font-size: 1.15em;
    }
}



/* ************************************************** 
 * Q&A
 * ************************************************** */

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item:nth-child(2n) {
    background: #f4f7fc;
    border-radius: 10px;
}

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__q, 
.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__a {
    padding: 10px 1em 10px 4em;
}

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__q:before,
.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__a:before {
    top: 10px;
    left: 20px;
}

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__q:before {
    background: #0F318A;
    color: #fff;
    border: none;
}

.karen-faq-list .wp-block-synx-block-qa-item.synx-block-qa__item .synx-block-qa__a:before {
    background: #be0000;
    color: #fff;
    border: none;
}

.karen-faq-list .wp-block-paragraph a {
    padding-left: 5px;
    padding-right: 5px;
}
.karen-faq-list .wp-block-paragraph a::after {
    content: "\f138";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    padding-left: 2px;
    display: inline-block;
}



/* ************************************************** 
/* 検索ボックス
 * ************************************************** */

.karen-icon-box-search {
	max-width: 525px;
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 768px) {
	.karen-icon-box-search {
		margin-left: 30px;
		margin-right: 30px;
	}
}



/* ************************************************** 
/* 標準ボタンブロック
 * 枠線の場合のhover時、active時に分かりやすい動きを与える
 * ************************************************** */

.karen-common-buttons {
    --karen-button-common-background-color: #fff;
    --karen-button-common-border-color: var(--color-main);
    --karen-button-common-color: var(--color-main);

    --karen-button-custom-1-background-color: #fff;
    --karen-button-custom-1-border-color: #000;
    --karen-button-custom-1-color: #000;
    
    --karen-button-custom-2-background-color: #fff;
    --karen-button-custom-2-border-color: var(--color-main);
    --karen-button-custom-2-color: var(--color-main);
}

.karen-common-buttons .wp-block-button a {
	transition: background-color 0.2s ease, transform 0.1s ease;
    border-width: 3px !important;
    border-style: solid !important;
    /* CTA用ボタン方式 */
    /* transition: all 0.2s ease-in-out; */
}

.karen-common-buttons .wp-block-button a {
    background-color: var(--karen-button-common-background-color) !important;
    border-color: var(--karen-button-common-border-color) !important;
    color: var(--karen-button-common-color) !important;
}
.karen-common-buttons .wp-block-button.karen-button-common a {
    background-color: var(--karen-button-common-background-color) !important;
    border-color: var(--karen-button-common-border-color) !important;
    color: var(--karen-button-common-color) !important;
}
.karen-common-buttons .wp-block-button.karen-button-custom-1 a {
    background-color: var(--karen-button-custom-1-background-color) !important;
    border-color: var(--karen-button-custom-1-border-color) !important;
    color: var(--karen-button-custom-1-color) !important;
}
.karen-common-buttons .wp-block-button.karen-button-custom-2 a {
    background-color: var(--karen-button-custom-2-background-color) !important;
    border-color: var(--karen-button-custom-2-border-color) !important;
    color: var(--karen-button-custom-2-color) !important;
}


.karen-common-buttons .wp-block-button a:hover {
    opacity: 1.0;
    background-color: color-mix(in oklab, #000 7%, var(--karen-button-common-background-color)) !important;
    border-color: color-mix(in oklab, #fff 7%, var(--karen-button-common-border-color)) !important;
    color: color-mix(in oklab, #fff 7%, var(--karen-button-common-color)) !important;
}

.karen-common-buttons .wp-block-button.karen-button-common a:hover {
    background-color: color-mix(in oklab, #000 7%, var(--karen-button-common-background-color)) !important;
    border-color: color-mix(in oklab, #fff 7%, var(--karen-button-common-border-color)) !important;
    color: color-mix(in oklab, #fff 7%, var(--karen-button-common-color)) !important;
}

.karen-common-buttons .wp-block-button.karen-button-custom-1 a:hover {
    background-color: color-mix(in oklab, #000 5%, var(--karen-button-custom-1-background-color)) !important;
    border-color: color-mix(in oklab, #fff 5%, var(--karen-button-custom-1-border-color)) !important;
    color: color-mix(in oklab, #fff 5%, var(--karen-button-custom-1-color)) !important;
    /* CTA用ボタン方式 */
    /*
    transform: translateY(2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
    opacity: 0.95;
    */
}

.karen-common-buttons .wp-block-button.karen-button-custom-2 a:hover {
    background-color: color-mix(in oklab, #000 5%, var(--karen-button-custom-2-background-color)) !important;
    border-color: color-mix(in oklab, #000 5%, var(--karen-button-custom-2-border-color)) !important;
    color: color-mix(in oklab, #000 5%, var(--karen-button-custom-2-color)) !important;
}

.karen-common-buttons .wp-block-button a:active {
    transform: scale(0.98);
}



/* ************************************************** 
/* カスタム表
 * ************************************************** */

/* カスタム1 */
/* 利用箇所
 * 磨き（ボディ）の軽度〜重度*/
.karen-custom-table-1 table {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}
.karen-custom-table-1 table tr th:nth-child(1) {
    width: 7em;
    vertical-align: middle;
    background: var(--color-main) !important;
    color: #fff;
    text-align: center;
}
.karen-custom-table-1 table tr td:nth-child(2) {
    vertical-align: middle;
}




/* カスタム2 */
/* 利用箇所
 * 磨き（ヘッドライト）のペーパー研磨 */
.karen-custom-table-2 table {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}
.karen-custom-table-2 table tr th,
.karen-custom-table-2 table tr td {
    vertical-align: middle;
    text-align: center;
}
.karen-custom-table-2 table tr th:nth-child(1) {
    width: 5em;
    background: var(--color-main) !important;
    color: #fff;
}
.karen-custom-table-2 table tr td:nth-child(2) {
    width: calc(calc(500px - 5em) / 2);
}
.karen-custom-table-2 table tr td:nth-child(3) {
    width: calc(calc(500px - 5em) / 2);
}




/* 車両サイズ */
.karen-custom-table-vehicle-size table {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.karen-custom-table-vehicle-size table thead tr th {
    vertical-align: middle;
    line-height: 1.2;
    text-align: center !important;
}
.karen-custom-table-vehicle-size table thead tr th:nth-child(1) {
    width: 5em !important;
}
.karen-custom-table-vehicle-size table thead tr th:nth-child(2) {
    width: 10em !important;
}
.karen-custom-table-vehicle-size table tbody tr td:nth-child(1) {
    text-align: center !important;
    background: var(--color-main) !important;
    color: #fff;
}
.karen-custom-table-vehicle-size table tbody tr td:nth-child(2) {
    text-align: center !important;
}
.karen-custom-table-vehicle-size table tbody tr td:nth-child(3) {
    text-align: left !important;
}

@media (max-width: 475px) {
    .karen-custom-table-vehicle-size table thead tr th:nth-child(1) {
        width: 3em !important;
    }
    .karen-custom-table-vehicle-size table thead tr th:nth-child(2) {
        width: 8em !important;
    }
}

/* 電装取り付け */
.karen-custom-table-electric-parts table {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.karen-custom-table-electric-parts table thead tr th {
    vertical-align: middle;
    text-align: center;
    line-height: 1.2;
    background: var(--color-main) !important;
    color: #fff;
}
.karen-custom-table-electric-parts table thead tr th:nth-child(2) {
    width: 10em !important;
}
.karen-custom-table-electric-parts table tbody tr td:nth-child(1) {
    text-align: left !important;
}
.karen-custom-table-electric-parts table tbody tr td:nth-child(2) {
    text-align: center !important;
}

@media (max-width: 475px) {
    .karen-custom-table-electric-parts table thead tr th:nth-child(2) {
        width: 8em !important;
    }
}


/* ************************************************** 
/* 画面幅による改行設定
 * ************************************************** */
.karen-br-narrow-475 {
    display: none;
}
.karen-br-narrow-400 {
    display: none;
}

@media (max-width: 475px) {
    .karen-br-narrow-475 {
        display: inline;
    }
}
@media (max-width: 400px) {
    .karen-br-narrow-400 {
        display: inline;
    }
}



/* ************************************************** 
/* 磨き（ボディ）のボディサイズ計算
 * ************************************************** */
.calc-polish-body-size {
    --calc-polish-body-size-result-color: #08a5ab;
}
.calc-polish-body-size table {
    margin-left: auto;
    margin-right: auto;
    max-width:500px; 
}

.calc-polish-body-size table tbody th {
    font-size: 1.0em;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    min-width: 100px;
    width: 100px;
    background: var(--color-main) !important;
    color: #fff;
}

.calc-polish-body-size table tbody td {
    font-size: 1.0em;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
}

.calc-polish-body-size table #body_length,
.calc-polish-body-size table #body_width,
.calc-polish-body-size table #body_height {
    font-size: 1.2em;
    width: calc(100% - 75px);
    max-width: 200px;
}

.calc-polish-body-size table #body_calc_result {
    font-size: 1.2em;
    font-weight: 400;
    text-align: center;
}

/*
.calc-polish-body-size table tfoot {
    border-top: 5px solid #08a5ab !important;
}
*/
.calc-polish-body-size table tfoot tr td {
    border: 5px solid var(--calc-polish-body-size-result-color) !important;
    border-left: none !important;
}

.calc-polish-body-size table tfoot th {
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    background: var(--calc-polish-body-size-result-color);
}

.calc-polish-body-size table #body_volume {
    font-size: 1.2em;
    font-weight: 700;
    text-align: center;
}

.calc-polish-body-size table tr td .string-unit {
    margin-left: 5px;
}



/* ************************************************** 
 * サービス別トップページ用　サービス一覧
 * 基本デザインはブログ一覧と同じ
 * ************************************************** */

.karen-services-top-list {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 15px 0;
    box-shadow: 1px 1px 5px #ddd;
}

.karen-services-top-list img {
    border-radius: 15px 0 0 0;
}

.karen-services-top-list .karen-common-buttons {
    margin: 20px 10px 15px 10px !important;
}

.karen-services-top-list p {
    margin: 15px 10px !important;
    line-height: 1.4;
}



/* **************************************************
 * サービス・コーティング（ボディ）用　コーティング種類一覧
 * ************************************************** */

.coating-type-list .card-pricing__type span {
    display: inline-block;
    padding: 0;
    margin: 0 10px 0 0;
    line-height: 1;
}
.coating-type-list .card-pricing__type span:last-child {
    margin: 0;
}

.coating-type-list .card-pricing__header {
    background: #000;
}

.coating-type-list .card-pricing__header .logo {
    object-fit: cover;
    width: 53px;
    height: 53px;
    margin: 5px 0;
    padding: 0;
    border-radius: 30px;
    box-shadow: 0 0 0 2px #fff;
    outline: 1px solid #000;
    outline-offset: 2px;
}

.coating-type-list .card-pricing__type {
    color: #fff;
}

.coating-type-list .card-pricing__price {
    font-size: 1em;
}

@media (max-width: 725px) {
    .coating-type-list .card-pricing__header .logo {
        margin: 0;
    }
}






/* 受付時間ラベル */
.company-reception-hours {
    padding: 3px 4px 2px 4px;
    border-radius: 3px;
    line-height: 1;
    border: 1px solid #000;
    background: #555;
    color: #fff;
    display: inline-block;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-right: 7px;
}



/* ※印リスト */
.karen-kome-list {
  list-style: none;
  padding-left: 0;
}

.karen-kome-list li {
  display: flex;
  gap: 5px;
}

.karen-kome-list li::before {
  content: "※";
  flex-shrink: 0;
  font-weight: 700 !important;
}


/* 検索ボックス　検索結果ページ用 */
.search-box-search-result {
    margin-top: 20px;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.3em;
    max-width: 800px;
}

.search-box-search-result .search-example {
    font-size: 0.85em;
}

@media (max-width: 768px) {
    .search-box-search-result {
        font-size: 1.2em;
        margin-left: 20px;
        margin-right: 20px;
    }
}
@media (max-width: 525px) {
    .search-box-search-result {
        font-size: 1.1em;
        margin-left: 0;
        margin-right: 0;
    }
}







/* 表に枠線を付ける */
.karen-common-table table {
    border: 1px solid #aaa !important;
}

/* 外部リンク用アイコン設定 */
.karen-link-external-site {
}
.karen-link-external-site::after {
    content: "\f35d";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    padding-left: 2px;
    display: inline-block;
}

/* 内部リンク用アイコン設定 */
.karen-link-internal-site {
}
.karen-link-internal-site::after {
    content: "\f138";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    padding-left: 2px;
    display: inline-block;
}