/*
Theme Name: Yutaka Kougyou WP
Theme URI: https://www.yutaka-kougyou.net/
Author: Yutaka Kougyou
Description: 有限会社ユタカ工業の WordPress 再構築テーマ
Version: 1.0.0
Text Domain: yutaka-kougyou-wp
*/

/* ============================================================
   01. Variables / Base
   ============================================================ */
:root {
    --color-primary: #f2a51f;
    --color-navy: #17335c;
    --color-navy-dark: #132b4f;
    --color-white: #ffffff;
    --color-text: #333333;
    --color-border: #dddddd;
    --container-width: 1200px;
    --radius-pill: 9999px;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.12);
    --shadow-button: 0 8px 22px rgba(0, 0, 0, 0.28);
    --footer-bg: #f6ad55;
    --footer-text: #9a5a32;
    --menu-blue-top: #244a7f;
    --menu-blue-mid: #17335c;
    --menu-blue-bottom: #102544;
    --menu-orange-top: #ffbf4d;
    --menu-orange-mid: #f39800;
    --menu-orange-bottom: #d97900;
    --menu-hover-top: #ffd8d2;
    --menu-hover-mid: #f5a8a5;
    --menu-hover-bottom: #e68686;

    /* ========================================================
       Font Control
       文字の種類・大きさを変更する場合は、原則ここだけを修正します
       ======================================================== */

    /* サイト全体の基本フォントです */
    --font-base: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;

    /* 明朝系を使いたい箇所がある場合の予備フォントです */
    --font-mincho: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", serif;

    /* --------------------------------------------------------
       Font Family Control
       各エリアのフォント種類を変更する場合はここを修正します
       使いすぎると統一感が崩れるため、基本は2種類までがおすすめです
       -------------------------------------------------------- */

    /* ヘッダー中央の会社名です */
    --font-site-title: var(--font-base);

    /* ヘッダー・フッターの親メニューボタンです */
    --font-main-menu: var(--font-base);

    /* ドロップダウンメニューです */
    --font-sub-menu: var(--font-base);

    /* トップ中央の6つのロゴボタンです */
    --font-hero-button: var(--font-base);

    /* お知らせ見出し・本文です */
    --font-news: var(--font-base);

    /* フッター会社名です */
    --font-footer-company: var(--font-mincho);

    /* フッターの住所・電話番号・FAXです */
    --font-footer-office: var(--font-mincho);

    /* ヘッダー中央の会社名です */
    --font-size-site-title: clamp(28px, 3vw, 48px);

    /* ヘッダーのメインメニューです */
    --font-size-main-menu: 18px;

    /* フッターのメニューです */
    --font-size-footer-menu: 18px;

    /* ドロップダウンメニューです */
    --font-size-sub-menu: 15px;

    /* トップ中央の6つのロゴボタンです */
    --font-size-hero-button: 42px;

    /* お知らせ見出しです */
    --font-size-news-title: 22px;

    /* お知らせ本文です */
    --font-size-news-text: 17px;

    /* フッター会社名です */
    --font-size-footer-company: 38px;

    /* フッターの住所・電話番号・FAXです */
    --font-size-footer-office: 18px;

    /* ヘッダー・フッターの親メニューボタン共通サイズです */
    --main-menu-button-height: 42px;
    --main-menu-button-padding-x: 18px;
    --main-menu-button-gap: 10px;

}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--font-base);
    color: var(--color-text);
    background: #f3f3f3;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.site-wrap {
    min-height: 100vh;
}

#main-content {
    min-height: 100vh;
}

/* ============================================================
   02. Header
   ============================================================ */
#site-header {
    position: relative;
    z-index: 10;
    background: var(--color-primary);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

.site-header-inner {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 14px 20px 12px;
}

.site-title-area {
    text-align: center;
    margin-bottom: 12px;
}

.site-title-link {
    font-family: var(--font-site-title);
    color: var(--color-white);
    font-size: var(--font-size-site-title);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.02em;
}

.site-nav,
.footer-nav {
    display: flex;
    justify-content: center;
}

/* ============================================================
   03. Header / Footer Menu Buttons
   ヘッダー・フッターの親メニューボタン共通管理
   ============================================================ */
.nav-menu,
.footer-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--main-menu-button-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav-menu li,
.footer-menu li {
    position: relative;
    list-style: none;
}

/* ヘッダー・フッター共通の親メニューボタンです
   ボタンサイズを変更する場合は、:root の
   --main-menu-button-height
   --main-menu-button-padding-x
   --main-menu-button-gap
   を調整します。 */
.nav-menu > li > a,
.footer-menu > li > a {
    font-family: var(--font-main-menu);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--main-menu-button-height);
    padding: 0 var(--main-menu-button-padding-x);
    background: linear-gradient(180deg, var(--menu-blue-top) 0%, var(--menu-blue-mid) 52%, var(--menu-blue-bottom) 100%);
    color: var(--color-white);
    border-radius: var(--radius-pill);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-bottom: 3px solid rgba(0, 0, 0, 0.45);
    font-size: var(--font-size-main-menu);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
    box-sizing: border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        inset 0 -2px 0 rgba(0, 0, 0, 0.18),
        0 4px 0 rgba(0, 0, 0, 0.28),
        0 7px 12px rgba(0, 0, 0, 0.24);
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, color 0.12s ease;
}

/* フッター側のフォントサイズだけ変えたい場合はここで管理します。
   ボタンの高さ・余白はヘッダーと共通にします。 */
.footer-menu > li > a {
    font-size: var(--font-size-footer-menu);
}

.nav-menu > li:hover > a,
.nav-menu > li:focus-within > a,
.footer-menu > li:hover > a,
.footer-menu > li:focus-within > a {
    background: linear-gradient(180deg, var(--menu-hover-top) 0%, var(--menu-hover-mid) 52%, var(--menu-hover-bottom) 100%);
    color: #3a1f1f;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-bottom: 3px solid rgba(150, 60, 60, 0.5);
    transform: translateY(-2px);
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -2px 0 rgba(150, 60, 60, 0.18),
        0 4px 0 rgba(150, 60, 60, 0.32),
        0 7px 12px rgba(0, 0, 0, 0.22);
}

.nav-menu > li > a:active,
.footer-menu > li > a:active {
    transform: translateY(2px);
    border-bottom-width: 1px;
    box-shadow:
        inset 0 2px 4px rgba(0, 0, 0, 0.3),
        0 2px 0 rgba(0, 0, 0, 0.2),
        0 3px 6px rgba(0, 0, 0, 0.22);
}

.nav-menu > li.current-menu-item > a,
.nav-menu > li.current_page_item > a,
.nav-menu > li.current-menu-parent > a,
.nav-menu > li.current_page_parent > a,
.nav-menu > li.current-menu-ancestor > a,
.nav-menu > li.current_page_ancestor > a,
.footer-menu > li.current-menu-item > a,
.footer-menu > li.current_page_item > a,
.footer-menu > li.current-menu-parent > a,
.footer-menu > li.current_page_parent > a,
.footer-menu > li.current-menu-ancestor > a,
.footer-menu > li.current_page_ancestor > a {
    background: linear-gradient(180deg, var(--menu-orange-top) 0%, var(--menu-orange-mid) 52%, var(--menu-orange-bottom) 100%);
    color: var(--color-white);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-bottom: 3px solid rgba(120, 70, 0, 0.5);
    outline: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.5),
        inset 0 -2px 0 rgba(120, 70, 0, 0.25),
        0 4px 0 rgba(120, 70, 0, 0.35),
        0 7px 12px rgba(0, 0, 0, 0.22);
}

/* ============================================================
   04. Dropdown Menu（丸替え版：真下配置＆重心完全一致・真の独楽回転）
   ============================================================ */
.nav-menu .sub-menu,
.footer-menu .sub-menu {
    display: none;
    position: absolute;
    left: 50%;
    min-width: 230px;
    margin: 0;
    padding: 10px;
    list-style: none;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(23, 51, 92, 0.18);
    border-radius: 12px;
    box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    z-index: 1000;
}

.nav-menu .sub-menu {
    top: 100%;
    transform: translateX(-50%);
    padding-top: 10px;
}

.footer-menu .sub-menu {
    bottom: 100%;
    transform: translateX(-50%);
    padding-bottom: 10px;
}

.nav-menu li:hover > .sub-menu,
.nav-menu li:focus-within > .sub-menu,
.footer-menu li:hover > .sub-menu,
.footer-menu li:focus-within > .sub-menu {
    display: block;
}

.nav-menu .sub-menu li,
.footer-menu .sub-menu li {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 0 8px;
}

.nav-menu .sub-menu li:last-child,
.footer-menu .sub-menu li:last-child {
    margin-bottom: 0;
}

.nav-menu .sub-menu a,
.footer-menu .sub-menu a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 38px;
    padding: 0 16px;
    background: linear-gradient(180deg, #f7fbff 0%, #dfeaf7 52%, #c8d8eb 100%);
    color: var(--color-navy);
    border-radius: var(--radius-pill);
    border: 1px solid rgba(23, 51, 92, 0.22);
    border-bottom: 3px solid rgba(23, 51, 92, 0.32);
    font-size: var(--font-size-sub-menu);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 -1px 0 rgba(23, 51, 92, 0.10),
        0 3px 0 rgba(23, 51, 92, 0.18),
        0 6px 10px rgba(0, 0, 0, 0.14);
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, color 0.12s ease;
}

.nav-menu .sub-menu li:hover > a,
.nav-menu .sub-menu li:focus-within > a,
.footer-menu .sub-menu li:hover > a,
.footer-menu .sub-menu li:focus-within > a {
    background: linear-gradient(180deg, var(--menu-hover-top) 0%, var(--menu-hover-mid) 52%, var(--menu-hover-bottom) 100%);
    color: #3a1f1f;
    border: 1px solid rgba(255, 255, 255, 0.78);
    border-bottom: 3px solid rgba(150, 60, 60, 0.48);
    transform: translateY(-1px);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -2px 0 rgba(150, 60, 60, 0.18),
        0 4px 0 rgba(150, 60, 60, 0.32),
        0 7px 12px rgba(0, 0, 0, 0.22);
}

.nav-menu .sub-menu a:active,
.footer-menu .sub-menu a:active {
    transform: translateY(2px);
    border-bottom-width: 1px;
    box-shadow:
        inset 0 2px 4px rgba(0, 0, 0, 0.22),
        0 1px 0 rgba(0, 0, 0, 0.18);
}

.nav-menu .sub-menu li.current-menu-item > a,
.nav-menu .sub-menu li.current_page_item > a,
.nav-menu .sub-menu li.current-menu-parent > a,
.nav-menu .sub-menu li.current_page_parent > a,
.nav-menu .sub-menu li.current-menu-ancestor > a,
.nav-menu .sub-menu li.current_page_ancestor > a,
.footer-menu .sub-menu li.current-menu-item > a,
.footer-menu .sub-menu li.current_page_item > a,
.footer-menu .sub-menu li.current-menu-parent > a,
.footer-menu .sub-menu li.current_page_parent > a,
.footer-menu .sub-menu li.current-menu-ancestor > a,
.footer-menu .sub-menu li.current_page_ancestor > a {
    background: linear-gradient(180deg, var(--menu-orange-top) 0%, var(--menu-orange-mid) 52%, var(--menu-orange-bottom) 100%);
    color: var(--color-white);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-bottom: 3px solid rgba(120, 70, 0, 0.5);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* 3階層目の子メニューを右側ではなく、「員の文字」の真下に展開します */
.nav-menu .sub-menu .sub-menu,
.footer-menu .sub-menu .sub-menu {
    display: none;
    position: absolute;
    top: 100%;                  
    left: 48px;                 /* 「員の文字」に合わせた右ずれ位置 */
    bottom: auto;
    transform: none;
    min-width: 230px;
    margin: 0;
    padding: 10px;
    z-index: 1100;
}

.nav-menu .sub-menu li:hover > .sub-menu,
.nav-menu .sub-menu li:focus-within > .sub-menu,
.footer-menu .sub-menu li:hover > .sub-menu,
.footer-menu .sub-menu li:focus-within > .sub-menu {
    display: block;
}

/* 矢印設定（幾何学重心を完全一致させ、独楽の芯を通した特殊クリッピング仕様） */
.nav-menu .sub-menu li.menu-item-has-children > a::after,
.footer-menu .sub-menu li.menu-item-has-children > a::after {
    content: "";                /* テキスト（▶）を消去 */
    margin-left: auto;
    
    /* 完全に正方形の均等な箱を生成 */
    display: inline-block !important;
    width: 12px !important;
    height: 12px !important;
    
    /* ボタンの文字色（ネイビー等）と自動連動する背景色 */
    background-color: currentColor; 
    
    /* 数学的に三角形の「図形的な重心」が正確に50%（真ん中）に位置するよう座標を型抜きします */
    clip-path: polygon(30% 12%, 30% 88%, 88% 50%);
    
    /* 回転の画鋲（軸）を、その完璧に重なった中心点にブスリと固定 */
    transform-origin: center center; 
    
    /* 0.22秒で、ブレを物理的にゼロにして気持ちよく回転するアニメーション */
    transition: transform 0.22s cubic-bezier(0.25, 1, 0.5, 1);
}

/* ホバー時：幾何学重心を中心に、1ミリもブレることなくその場で90度スピン（綺麗に▼になります） */
.nav-menu .sub-menu li.menu-item-has-children:hover > a::after,
.footer-menu .sub-menu li.menu-item-has-children:hover > a::after {
    transform: rotate(90deg);    
}

/* ============================================================
   05. Front Page Hero
   ============================================================ */
.hero-section {
    position: relative;
    min-height: 100vh;
    padding-top: 70px;
    background: url("images/00_home/bakground_image2.avif") center center / cover no-repeat;
    overflow: hidden;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.hero-inner {
    position: relative;
    z-index: 1;
    max-width: var(--container-width);
    margin: 0 auto;
    min-height: 820px;
    padding: 35px 20px 80px;
}

.hero-left {
    position: absolute;
    left: clamp(95px, 6.5vw, 125px);
    top: 42%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.hero-right {
    position: absolute;
    right: clamp(95px, 6.5vw, 125px);
    top: -30px;
    transform: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.hero-badge,
.hero-catch {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-width: 0;
    min-height: 76px;
    box-sizing: border-box;
    background: linear-gradient(145deg, #1c3f73, var(--color-navy-dark));
    color: var(--color-white);
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: var(--shadow-button);
    font-size: var(--font-size-hero-button);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.hero-left .hero-badge {
    justify-content: flex-start;
    gap: 16px;
    padding: 0 24px 0 32px;
    border-radius: 0 24px 24px 0;
    text-align: left;
}

.hero-left .hero-badge span {
    order: 1;
    flex: 0 0 auto;
    display: block;
    text-align: left;
}

.hero-left .hero-badge .hero-icon {
    order: 2;
    flex: 0 0 54px;
}

.hero-right .hero-catch {
    justify-content: flex-end;
    gap: 16px;
    padding: 0 32px 0 24px;
    border-radius: 24px 0 0 24px;
    text-align: right;
}

.hero-right .hero-catch .hero-icon {
    order: 1;
    flex: 0 0 54px;
}

.hero-right .hero-catch span {
    order: 2;
    flex: 0 0 auto;
    display: block;
    text-align: right;
}

.hero-icon {
    width: 54px;
    height: 54px;
    object-fit: contain;
    object-position: center;
    flex-shrink: 0;
    margin: 0;
    display: block;
}

.hero-left .hero-badge:nth-child(2) .hero-icon {
    clip-path: inset(8px 0 0 0);
}

.hero-badge:hover,
.hero-catch:hover {
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

/* ============================================================
   06. News Box
   ============================================================ */
.news-box {
    position: absolute;
    left: 50%;
    bottom: 160px;
    transform: translateX(-50%);
    width: 620px;
    padding: 26px 34px;
    background: rgba(24, 43, 76, 0.65);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    text-align: center;
}

.news-title {
    font-family: var(--font-news);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 110px;
    height: 38px;
    margin-bottom: 18px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: var(--radius-pill);
    color: var(--color-white);
    font-size: var(--font-size-news-title);
    font-weight: 700;
}

.news-list {
    font-family: var(--font-news);
    margin: 0;
    padding-left: 18px;
    color: var(--color-white);
    text-align: left;
    font-size: var(--font-size-news-text);
    line-height: 1.8;
}

.news-list li {
    margin-bottom: 6px;
}

/* ============================================================
   07. Footer
   ============================================================ */
#site-footer {
    background: var(--footer-bg);
    padding: 16px 20px 26px;
    color: var(--footer-text);
}

.site-footer-inner {
    max-width: 1120px;
    margin: 0 auto;
}

.footer-nav {
    margin-bottom: 12px;
}

.footer-company {
    text-align: center;
    color: var(--footer-text);
}

.footer-company-name {
    font-family: var(--font-footer-company);
    margin: 4px 0 10px;
    padding-bottom: 6px;
    border-bottom: 2px solid rgba(154, 90, 50, 0.65);
    font-size: var(--font-size-footer-company);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0.08em;
}

.footer-office-list {
    max-width: 1080px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 4px;
    text-align: left;
}

.footer-office-item {
    font-family: var(--font-footer-office);
    display: grid;
    grid-template-columns: 130px minmax(420px, 1fr) 190px 190px;
    align-items: center;
    column-gap: 16px;
    min-height: 28px;
    color: var(--footer-text);
    font-size: var(--font-size-footer-office);
    line-height: 1.45;
}

.footer-office-label {
    font-weight: 400;
    white-space: nowrap;
    letter-spacing: 0.12em;
}

.footer-office-address,
.footer-office-tel,
.footer-office-fax {
    white-space: nowrap;
}

/* フッターの拠点・TEL・FAXに表示するSVGアイコンです */
.footer-office-label::before,
.footer-office-tel::before,
.footer-office-fax::before {
    content: "" !important;
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 7px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    vertical-align: -3px;
}

.footer-office-label::before {
    background-image: url("images/00_home/icon-office.svg");
}

.footer-office-tel::before {
    background-image: url("images/00_home/icon-tel.svg");
}

.footer-office-fax::before {
    background-image: url("images/00_home/icon-fax.svg");
}

/* ============================================================
   08. Wipe Animation
   ============================================================ */
.hero-left .hero-badge,
.hero-right .hero-catch {
    opacity: 0;
    will-change: transform, opacity, filter;
}

.hero-left .hero-badge {
    transform: translateX(-50px);
}

.hero-right .hero-catch {
    transform: translateX(50px);
}

.is-visible .hero-left .hero-badge {
    animation: wipeLeft 0.7s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.is-visible .hero-right .hero-catch {
    animation: wipeRight 0.7s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.hero-left .hero-badge:nth-child(1),
.hero-right .hero-catch:nth-child(1) {
    animation-delay: 0.2s;
}

.hero-left .hero-badge:nth-child(2),
.hero-right .hero-catch:nth-child(2) {
    animation-delay: 0.4s;
}

.hero-left .hero-badge:nth-child(3),
.hero-right .hero-catch:nth-child(3) {
    animation-delay: 0.6s;
}

@keyframes wipeLeft {
    from {
        opacity: 0;
        transform: translateX(-50px);
        filter: blur(6px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

@keyframes wipeRight {
    from {
        opacity: 0;
        transform: translateX(50px);
        filter: blur(6px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

/* ============================================================
   09. Responsive
   ============================================================ */
/* 画面幅768px以下のスマートフォン向け調整です */
@media (max-width: 768px) {
    .site-header-inner {
        padding: 12px 16px 10px;
    }

    .site-title-link,
    .footer-company-name {
        font-size: clamp(24px, 6vw, 34px);
    }

    .nav-menu,
    .footer-menu {
        flex-direction: column;
        align-items: center;
        gap: 6px;
    }

    .nav-menu > li > a,
    .footer-menu > li > a {
        min-height: 34px;
        padding: 0 12px;
        font-size: 12px;
    }

    .nav-menu .sub-menu,
    .footer-menu .sub-menu,
    .nav-menu .sub-menu .sub-menu,
    .footer-menu .sub-menu .sub-menu {
        position: static;
        left: auto;
        top: auto;
        bottom: auto;
        transform: none;
        min-width: 0;
        margin-top: 6px;
        background: rgba(255, 255, 255, 0.92);
        box-shadow: none;
    }

    .hero-section {
        min-height: 760px;
        padding-top: 80px;
    }

    .hero-inner {
        min-height: 760px;
        padding: 40px 16px;
    }

    .hero-left,
    .hero-right {
        position: static;
        left: auto;
        right: auto;
        top: auto;
        transform: none;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .hero-left {
        margin-bottom: 24px;
    }

    .hero-right {
        margin-bottom: 28px;
    }

    .hero-left .hero-badge,
    .hero-right .hero-catch {
        width: fit-content;
        max-width: 100%;
        min-height: 54px;
        padding: 0 18px;
        font-size: var(--font-size-news-title);
    }

    .hero-left .hero-badge {
        border-radius: 0 20px 20px 0;
    }

    .hero-right .hero-catch {
        border-radius: 20px 0 0 20px;
        margin-left: auto;
    }

    .hero-left .hero-badge .hero-icon,
    .hero-right .hero-catch .hero-icon,
    .hero-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .news-box {
        position: static;
        transform: none;
        width: calc(100% - 32px);
        margin-top: 24px;
        padding: 24px 20px;
    }

    .news-title {
        font-size: var(--font-size-main-menu);
    }

    .news-list {
        font-size: var(--font-size-sub-menu);
    }

    #site-footer {
        padding: 24px 16px 28px;
    }

    .footer-office-list {
        max-width: none;
    }

    .footer-office-item {
        grid-template-columns: 1fr;
        gap: 4px;
        text-align: center;
        font-size: var(--font-size-sub-menu);
        min-height: 0;
    }

    .footer-office-address,
    .footer-office-tel,
    .footer-office-fax {
        white-space: normal;
    }
}

/* ============================================================
   10. Greeting Page
   固定ページ本文を使う「ご挨拶」専用レイアウト
   ============================================================ */

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-greeting #main-content > h1:first-child,
.page-template-page-greeting main > h1:first-child,
.page-template-page-greeting article > h1:first-child,
.page-template-page-greeting .content-area > h1:first-child,
.page-template-page-greeting .site-main > h1:first-child,
.page-template-page-greeting .entry-title,
.page-template-page-greeting h1.entry-title,
.page-template-page-greeting .wp-block-post-title {
    display: none !important;
}

/* ページ全体の背景と上下余白です */
.page-greeting {
    background: #efefef;
    padding: 30px 0 42px;
}

/* 横長の用紙に近い外枠です */
.page-greeting__section {
    width: 100%;
}

.page-greeting__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 36px;
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-greeting__header {
    max-width: 1040px;
    margin: 0 auto 24px;
    text-align: center;
}

.page-greeting__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.08em;
    color: #3f302b;
}

/* タイトル下の紺色ラインです */
.page-greeting__line {
    width: 100%;
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* 本文全体です */
.page-greeting__content {
    max-width: 1040px;
    margin: 0 auto;
}

/* WordPress本文をそのまま整形します */
.page-greeting__body {
    font-family: var(--font-mincho);
    font-size: 19px;
    font-weight: 600;
    line-height: 2.15;
    letter-spacing: 0.055em;
    color: #5b463f;
}

/* 段落の間隔です */
.page-greeting__body p {
    margin: 0 0 2.05em;
}

/* 最終段落の余白を詰めます */
.page-greeting__body p:last-child {
    margin-bottom: 0;
}

/* 太字を少し強めます */
.page-greeting__body strong {
    font-weight: 700;
}

/* Gutenbergが自動で付ける余白を抑制します */
.page-greeting__body > *:first-child {
    margin-top: 0;
}

.page-greeting__body > *:last-child {
    margin-bottom: 0;
}

/* 横幅が広いPCでは、本家寄りにさらに横長にします */
@media screen and (min-width: 1200px) {
    .page-greeting {
        padding-top: 28px;
        padding-bottom: 38px;
    }

    .page-greeting__inner {
        max-width: 1320px;
    }

    .page-greeting__header,
    .page-greeting__content {
        max-width: 1080px;
    }

    .page-greeting__title {
        font-size: 56px;
    }

    .page-greeting__body {
        font-size: 20px;
        line-height: 2.1;
    }

    .page-greeting__body p {
        margin-bottom: 1.85em;
    }
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-greeting {
        padding: 28px 0 40px;
    }

    .page-greeting__inner {
        padding: 0 28px;
    }

    .page-greeting__header,
    .page-greeting__content {
        max-width: 900px;
    }

    .page-greeting__title {
        font-size: 44px;
    }

    .page-greeting__body {
        font-size: 18px;
        line-height: 2.05;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-greeting {
        padding: 24px 0 36px;
    }

    .page-greeting__inner {
        padding: 0 18px;
    }

    .page-greeting__header {
        margin-bottom: 20px;
    }

    .page-greeting__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.05em;
    }

    .page-greeting__line {
        height: 4px;
    }

    .page-greeting__body {
        font-size: 16px;
        line-height: 2;
        letter-spacing: 0.03em;
    }

    .page-greeting__body p {
        margin-bottom: 1.7em;
    }
}

/* ============================================================
   11. Common Content Edge / Natural Footer Position
   メニュー両端幅に合わせる共通幅と、本文量に応じたフッター位置調整
   ============================================================ */

/* 
   ページ本文・タイトル線・フッター会社情報などの基準幅です。
   上部メニューの両端に近い幅として使います。
   ここを変更すると、各ページの横幅をまとめて調整できます。
*/
:root {
    --content-edge-width: 1020px;
    --content-side-padding: 36px;
}

/* 固定ページでは、本文量に応じてフッターが自然に続くようにします */
.page #main-content {
    min-height: auto;
}

/* ご挨拶ページ全体も、画面高固定ではなく本文量に合わせます */
.page-greeting {
    min-height: auto;
    padding-top: 30px;
    padding-bottom: 42px;
}

/* ご挨拶ページの各横幅をメニュー両端幅へ統一します */
.page-greeting__inner,
.page-greeting__header,
.page-greeting__content {
    max-width: var(--content-edge-width);
}

/* 内側余白だけを持たせ、横幅そのものは共通幅に合わせます */
.page-greeting__inner {
    padding-left: var(--content-side-padding);
    padding-right: var(--content-side-padding);
}

/* タイトル下の線も共通幅いっぱいにします */
.page-greeting__line {
    width: 100%;
}

/* 本文は親幅いっぱいを使い、不自然な折り返しを減らします */
.page-greeting__body {
    width: 100%;
}

/* 汎用固定ページ用に使っている場合の幅も統一します */
.page-content-wrap,
.page-body {
    max-width: var(--content-edge-width);
}

/* お知らせボックスも同じ幅基準で扱いたい場合の控えめ幅です */
.news-box {
    width: min(760px, calc(100% - 360px));
}

/* フッター全体の中身もメニュー両端幅へ合わせます */
.site-footer-inner,
.footer-office-list {
    max-width: var(--content-edge-width);
}

/* フッターは内容に応じて自然に配置します。
   fixed / absolute 的な固定配置にはしません。 */
#site-footer {
    position: relative;
    top: auto;
    bottom: auto;
    margin-top: 0;
}

/* ご挨拶など固定ページでは、本文直後にフッターが自然に来るようにします */
.page-template-page-greeting #site-footer {
    margin-top: 0;
}

/* 本家寄せで、固定ページ本文の上下余白を少し控えめにします */
.page-greeting__body p {
    margin-bottom: 1.75em;
}

/* 横幅が広いPCでも、共通幅から外れないようにします */
@media screen and (min-width: 1200px) {
    .page-greeting__inner,
    .page-greeting__header,
    .page-greeting__content,
    .site-footer-inner,
    .footer-office-list {
        max-width: var(--content-edge-width);
    }
}

/* タブレット以下は画面幅に合わせて自然に縮めます */
@media screen and (max-width: 1024px) {
    :root {
        --content-side-padding: 28px;
    }

    .page-greeting__inner,
    .page-greeting__header,
    .page-greeting__content,
    .site-footer-inner,
    .footer-office-list {
        max-width: calc(100% - 56px);
    }
}

/* スマートフォンでは左右余白を小さめにします */
@media screen and (max-width: 767px) {
    :root {
        --content-side-padding: 18px;
    }

    .page-greeting__inner,
    .page-greeting__header,
    .page-greeting__content,
    .site-footer-inner,
    .footer-office-list {
        max-width: calc(100% - 36px);
    }

    .news-box {
        width: calc(100% - 32px);
    }
}

/* ============================================================
   12. Company Page ACF
   ACF無料版を使う「会社概要」専用レイアウト
   ============================================================ */

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-company #main-content > h1:first-child,
.page-template-page-company main > h1:first-child,
.page-template-page-company article > h1:first-child,
.page-template-page-company .content-area > h1:first-child,
.page-template-page-company .site-main > h1:first-child,
.page-template-page-company .entry-title,
.page-template-page-company h1.entry-title,
.page-template-page-company .wp-block-post-title {
    display: none !important;
}

/* ページ全体です */
.page-company {
    background: #efefef;
    padding: 30px 0 42px;
}

/* メニュー両端幅に合わせる外枠です */
.page-company__section {
    width: 100%;
}

.page-company__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0 var(--content-side-padding, 36px);
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-company__header {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 24px;
    text-align: center;
}

.page-company__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.08em;
    color: #3f302b;
}

.page-company__line {
    width: 100%;
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* ACF表示時の左右構成です */
.page-company__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 34px;
    align-items: start;
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
}

/* 左側の会社情報です */
.page-company__main {
    min-width: 0;
}

.company-block {
    margin: 0 0 28px;
}

.company-block:last-child {
    margin-bottom: 0;
}

.company-block__title {
    margin: 0 0 10px;
    padding-left: 12px;
    border-left: 6px solid #0b4a86;
    font-family: var(--font-mincho);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.35;
    color: #3f302b;
}

/* 会社概要テーブルです */
.company-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.7;
    color: #333333;
}

.company-table th,
.company-table td {
    padding: 8px 10px;
    border-bottom: 1px solid rgba(11, 74, 134, 0.18);
    vertical-align: top;
}

.company-table th {
    width: 150px;
    color: #3f302b;
    font-weight: 700;
    white-space: nowrap;
}

.company-table td {
    word-break: break-word;
}

/* 主要取引先です */
.company-clients {
    padding: 8px 10px;
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.9;
    color: #333333;
}

/* スライドショー全体です */
.company-slider {
    position: relative;
    width: 100%;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(11, 74, 134, 0.16);
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.13);
    overflow: hidden;
}

/* スライドの表示枠です */
.company-slider__viewport {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #ffffff;
}

/* 各スライドです */
.company-slider__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.7s ease;
}

.company-slider__slide.is-active {
    opacity: 1;
}

.company-slider__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 左右ボタンです */
.company-slider__button {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 34px;
    height: 52px;
    border: 0;
    transform: translateY(-50%);
    background: rgba(23, 51, 92, 0.72);
    color: #ffffff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
}

.company-slider__button--prev {
    left: 0;
    border-radius: 0 8px 8px 0;
}

.company-slider__button--next {
    right: 0;
    border-radius: 8px 0 0 8px;
}

.company-slider__button:hover,
.company-slider__button:focus {
    background: rgba(243, 152, 0, 0.88);
}

/* ドットです */
.company-slider__dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    z-index: 3;
    display: flex;
    justify-content: center;
    gap: 8px;
}

.company-slider__dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
}

.company-slider__dot.is-active {
    background: #f39800;
}

/* ACF未入力時に固定ページ本文を表示する場合です */
.page-company__content {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    font-family: var(--font-mincho);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.85;
    letter-spacing: 0.04em;
    color: #333333;
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-company {
        padding: 28px 0 40px;
    }

    .page-company__inner {
        padding: 0 28px;
    }

    .page-company__title {
        font-size: 44px;
    }

    .page-company__layout {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .company-slider {
        max-width: 520px;
        margin: 0 auto;
    }

    .company-table,
    .company-clients,
    .page-company__content {
        font-size: 18px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-company {
        padding: 24px 0 36px;
    }

    .page-company__inner {
        padding: 0 18px;
    }

    .page-company__header {
        margin-bottom: 20px;
    }

    .page-company__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.05em;
    }

    .page-company__line {
        height: 4px;
    }

    .company-block__title {
        font-size: 21px;
    }

    .company-table,
    .company-clients,
    .page-company__content {
        font-size: 16px;
        line-height: 1.8;
    }

    .company-table th,
    .company-table td {
        display: block;
        width: auto;
        padding: 7px 6px;
    }

    .company-table th {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .company-table td {
        padding-top: 2px;
    }

    .company-slider__button {
        width: 30px;
        height: 46px;
        font-size: 28px;
    }
}

/* ============================================================
   Company Slider Layout C
   会社概要スライドショーをタイトル直下の横長配置にします
   ============================================================ */

/* ACF表示時は1カラム構成にします */
.page-company__layout--single {
    display: block;
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
}

/* タイトル直下の横長スライダーです */
.company-slider--wide {
    width: 100%;
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 34px;
}

/* 横長写真として見せる比率です */
.company-slider--wide .company-slider__viewport {
    aspect-ratio: 16 / 7;
}

/* 写真は枠いっぱいに表示します */
.company-slider--wide .company-slider__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 会社情報本体をスライダー下へ自然につなげます */
.page-company__main {
    width: 100%;
}

/* 会社情報の余白を少し詰め、縦長感を抑えます */
.page-company .company-block {
    margin-bottom: 24px;
}

.page-company .company-table th,
.page-company .company-table td {
    padding-top: 6px;
    padding-bottom: 6px;
}

/* タブレット以下は少し縦長比率へ戻します */
@media screen and (max-width: 1024px) {
    .company-slider--wide {
        margin-bottom: 28px;
    }

    .company-slider--wide .company-slider__viewport {
        aspect-ratio: 16 / 8;
    }
}

/* スマートフォンでは見切れを抑えます */
@media screen and (max-width: 767px) {
    .company-slider--wide {
        margin-bottom: 24px;
    }

    .company-slider--wide .company-slider__viewport {
        aspect-ratio: 4 / 3;
    }
}

/* ============================================================
   13. History Page
   MySQL管理の沿革ページ専用レイアウト
   ============================================================ */

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-history #main-content > h1:first-child,
.page-template-page-history main > h1:first-child,
.page-template-page-history article > h1:first-child,
.page-template-page-history .content-area > h1:first-child,
.page-template-page-history .site-main > h1:first-child,
.page-template-page-history .entry-title,
.page-template-page-history h1.entry-title,
.page-template-page-history .wp-block-post-title {
    display: none !important;
}

/* ページ全体です */
.page-history {
    background: #efefef;
    padding: 30px 0 42px;
}

/* メニュー両端幅に合わせる外枠です */
.page-history__section {
    width: 100%;
}

.page-history__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0 var(--content-side-padding, 36px);
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-history__header {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 18px;
    text-align: center;
}

.page-history__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.08em;
    color: #3f302b;
}

/* タイトル下の紺色ラインです */
.page-history__line {
    width: 100%;
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* 本文表示領域です */
.page-history__content {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    font-family: var(--font-mincho);
    color: #222222;
}

/* MySQLから読み込んだ沿革テーブルです */
.history-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;

    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.55;
    color: #222222;
}

/* セル共通です */
.history-table th,
.history-table td {
    padding: 5px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.28);
    vertical-align: top;
}

/* 年月列です */
.history-table th {
    width: 170px;
    padding-left: 0;
    color: #111111;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}

/* 和暦は年月の下に表示します */
.history-table th span {
    display: block;
    font-weight: 700;
}

/* 内容列です */
.history-table td {
    padding-right: 0;
}

/* データ未登録時の表示です */
.page-history__empty {
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    padding: 40px 0;
    color: #333333;
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-history {
        padding: 28px 0 40px;
    }

    .page-history__inner {
        padding: 0 28px;
    }

    .page-history__title {
        font-size: 44px;
    }

    .history-table {
        font-size: 17px;
    }

    .history-table th {
        width: 150px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-history {
        padding: 24px 0 36px;
    }

    .page-history__inner {
        padding: 0 18px;
    }

    .page-history__header {
        margin-bottom: 18px;
    }

    .page-history__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.05em;
    }

    .page-history__line {
        height: 4px;
    }

    .history-table {
        font-size: 15px;
        line-height: 1.65;
    }

    .history-table th {
        width: 110px;
    }

    .history-table th,
    .history-table td {
        padding: 6px 6px;
    }

    .page-history__empty {
        font-size: 15px;
        padding: 30px 0;
    }
}

/* ============================================================
   History Text Line Break
   沿革本文の改行表示を安定させます
   ============================================================ */

.history-table td {
    white-space: normal;
}

/* ============================================================
   14. Equipment Page
   MySQL管理の会社設備ページ専用レイアウト
   ============================================================ */

.page-template-page-equipment #main-content > h1:first-child,
.page-template-page-equipment main > h1:first-child,
.page-template-page-equipment article > h1:first-child,
.page-template-page-equipment .content-area > h1:first-child,
.page-template-page-equipment .site-main > h1:first-child,
.page-template-page-equipment .entry-title,
.page-template-page-equipment h1.entry-title,
.page-template-page-equipment .wp-block-post-title {
    display: none !important;
}

.page-equipment {
    background: #efefef;
    padding: 30px 0 42px;
}

.page-equipment__section {
    width: 100%;
}

.page-equipment__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0 var(--content-side-padding, 36px);
    box-sizing: border-box;
}

.page-equipment__header {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 24px;
    text-align: center;
}

.page-equipment__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.08em;
    color: #3f302b;
}

.page-equipment__line {
    width: 100%;
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

.equipment-tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 20px;
    background: #dddddd;
}

.equipment-tab {
    min-height: 46px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.8);
    background: #d6d6d6;
    color: #333333;
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}

.equipment-tab:last-child {
    border-right: 0;
}

.equipment-tab:hover,
.equipment-tab:focus {
    background: #ffd6bf;
}

.equipment-tab.is-active {
    background: #ffc3a2;
}

.equipment-panels {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 12px 14px 52px;
    background: #ffffff;
    box-sizing: border-box;
}

.equipment-panel {
    display: none !important;
}

.equipment-panel.is-active {
    display: block !important;
}

/*
   列幅は page-equipment.php の colgroup style 属性で確定します。
   設備名 28% / 型式 24% / 備考 48%
*/
.equipment-table {
    width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse;
    border-spacing: 0;
    font-family: var(--font-base);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.55;
    color: #24404a;
}

.equipment-category-row th {
    padding: 8px 12px;
    background: #58747c;
    color: #ffffff;
    text-align: left;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.equipment-category-count {
    display: inline-block;
    margin-left: 1.1em;
    font-size: 0.95em;
    font-weight: 700;
}

.equipment-item-row td {
    padding: 8px 12px;
    border: 0;
    vertical-align: top;
}

.equipment-item-row:nth-child(odd) td {
    background: #f3edda;
}

.equipment-item-row:nth-child(even) td {
    background: #fbf6e6;
}

.equipment-table .equipment-item-name {
    width: 28% !important;
    white-space: nowrap;
}

.equipment-table .equipment-item-model {
    width: 24% !important;
    white-space: nowrap;
}

.equipment-table .equipment-item-note {
    width: 48% !important;
    white-space: normal;
}

.equipment-item-count {
    display: inline-block;
    margin-left: 0.6em;
    color: #58747c;
    font-size: 0.95em;
    font-weight: 700;
}

.page-equipment__empty {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 42px 0;
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: #333333;
}

@media screen and (max-width: 1024px) {
    .page-equipment {
        padding: 28px 0 40px;
    }

    .page-equipment__inner {
        padding: 0 28px;
    }

    .page-equipment__title {
        font-size: 44px;
    }

    .equipment-tab {
        font-size: 17px;
    }

    .equipment-table {
        font-size: 14px;
    }
}

@media screen and (max-width: 767px) {
    .page-equipment {
        padding: 24px 0 36px;
    }

    .page-equipment__inner {
        padding: 0 18px;
    }

    .page-equipment__header {
        margin-bottom: 20px;
    }

    .page-equipment__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.05em;
    }

    .page-equipment__line {
        height: 4px;
    }

    .equipment-tabs {
        grid-template-columns: 1fr;
    }

    .equipment-tab {
        min-height: 42px;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.8);
        font-size: 16px;
    }

    .equipment-panels {
        padding: 10px 8px 34px;
    }

    .equipment-table {
        font-size: 13px;
        line-height: 1.5;
    }

    .equipment-item-row td {
        display: block;
        width: auto !important;
        padding: 7px 9px;
    }

    .equipment-item-name,
    .equipment-item-model,
    .equipment-item-note {
        white-space: normal !important;
    }

    .equipment-item-name {
        padding-bottom: 2px !important;
    }

    .equipment-item-model,
    .equipment-item-note {
        padding-top: 2px !important;
    }
}

/* ============================================================
   15. Access Page
   MySQL管理のアクセスページ専用レイアウト
   ============================================================ */

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-access #main-content > h1:first-child,
.page-template-page-access main > h1:first-child,
.page-template-page-access article > h1:first-child,
.page-template-page-access .content-area > h1:first-child,
.page-template-page-access .site-main > h1:first-child,
.page-template-page-access .entry-title,
.page-template-page-access h1.entry-title,
.page-template-page-access .wp-block-post-title {
    display: none !important;
}

/* ページ全体です */
.page-access {
    background: #efefef;
    padding: 30px 0 42px;
}

/* メニュー両端幅に合わせる外枠です */
.page-access__section {
    width: 100%;
}

.page-access__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0 var(--content-side-padding, 36px);
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-access__header {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto 26px;
    text-align: center;
}

.page-access__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.08em;
    color: #3f302b;
}

/* タイトル下の紺色ラインです */
.page-access__line {
    width: 100%;
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* 拠点一覧です */
.access-list {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
}

/* 1拠点分のブロックです */
.access-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 22px;
    padding: 34px 0 42px;
    border-top: 5px solid #0b4a86;
}

.access-card:first-child {
    padding-top: 0;
    border-top: 0;
}

.access-card__left,
.access-card__right {
    min-width: 0;
}

/* 拠点名です */
.access-card__title {
    margin: 0 0 8px;
    font-family: var(--font-mincho);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35;
    color: #2f2f2f;
}

/* 住所・案内文です */
.access-card__text {
    min-height: 126px;
    font-family: var(--font-base);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.45;
    color: #222222;
}

.access-card__text p {
    margin: 0 0 6px;
}

.access-card__label {
    display: inline-block;
    margin-right: 0.4em;
    font-weight: 700;
}

/* 外観写真です */
.access-photo {
    position: relative;
    margin: 12px 0 0;
    width: 100%;
    background: #ffffff;
    overflow: hidden;
}

.access-photo img {
    width: 100%;
    aspect-ratio: 16 / 7.5;
    object-fit: cover;
}

.access-photo figcaption {
    position: absolute;
    right: 10px;
    bottom: 8px;
    padding: 4px 10px;
    background: rgba(255, 255, 255, 0.88);
    color: #333333;
    font-family: var(--font-base);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

/* Googleマップです */
.access-map {
    width: 100%;
    height: 100%;
    min-height: 292px;
    background: #ffffff;
    overflow: hidden;
}

.access-map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 292px;
    border: 0;
}

.access-map--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mincho);
    font-size: 16px;
    font-weight: 600;
    color: #666666;
}

/* データ未登録時です */
.page-access__empty {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 42px 0;
    font-family: var(--font-mincho);
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: #333333;
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-access {
        padding: 28px 0 40px;
    }

    .page-access__inner {
        padding: 0 28px;
    }

    .page-access__title {
        font-size: 44px;
    }

    .access-card {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .access-card__text {
        min-height: 0;
    }

    .access-map,
    .access-map iframe {
        min-height: 320px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-access {
        padding: 24px 0 36px;
    }

    .page-access__inner {
        padding: 0 18px;
    }

    .page-access__header {
        margin-bottom: 22px;
    }

    .page-access__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.05em;
    }

    .page-access__line {
        height: 4px;
    }

    .access-card {
        padding: 26px 0 32px;
        border-top-width: 4px;
    }

    .access-card__title {
        font-size: 24px;
    }

    .access-card__text {
        font-size: 18px;
    }

    .access-photo img {
        aspect-ratio: 16 / 9;
    }

    .access-map,
    .access-map iframe {
        min-height: 260px;
    }
}

/* ============================================================
   16. Services Page
   「金属プレス加工」ってなーに？ 専用レイアウト
   ============================================================ */

/* 業務内容トップページで使う幅です */
:root {
    --services-text-width: 860px;
    --services-media-width: 760px;
    --services-media-wide-width: 860px;

    /* 青線の左右余白です。
       業務内容詳細ページと同じ見え方に合わせています。 */
    --services-line-side-gap: 28px;
}

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-services #main-content > h1:first-child,
.page-template-page-services main > h1:first-child,
.page-template-page-services article > h1:first-child,
.page-template-page-services .content-area > h1:first-child,
.page-template-page-services .site-main > h1:first-child,
.page-template-page-services .entry-title,
.page-template-page-services h1.entry-title,
.page-template-page-services .wp-block-post-title {
    display: none !important;
}

/* ページ全体です */
.page-services {
    background: #efefef;
    padding: 24px 0 42px;
}

/* メニュー両端幅に合わせる外枠です */
.page-services__section {
    width: 100%;
}

.page-services__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-services__header {
    max-width: var(--content-edge-width, 1020px);
    width: 100%;
    margin: 0 auto 26px;
    text-align: center;
    box-sizing: border-box;
}

.page-services__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.04em;
    color: #111111;
}

/* タイトル下の紺色ラインです */
.page-services__line {
    width: calc(100% - (var(--services-line-side-gap) * 2));
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* 固定ページ本文全体です */
.page-services__content {
    max-width: var(--content-edge-width, 1020px);
    width: 100%;
    margin: 0 auto;
    padding-top: 0;
    box-sizing: border-box;
}

.page-services__body {
    font-family: var(--font-base);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.03em;
    color: #3f302b;
}

/* Gutenberg本文の基本余白です */
.page-services__body > *:first-child {
    margin-top: 0;
}

.page-services__body > *:last-child {
    margin-bottom: 0;
}

.page-services__body p {
    margin: 0 0 1.45em;
}

/* 回転表示させる本文ブロックです。
   実際の回転は services-animation.js 側で制御します。
   CSS側では初期状態と最終状態だけを持たせます。 */
.service-rotate-block {
    position: relative;
    width: min(100%, var(--services-text-width));
    max-width: var(--services-text-width);
    margin: 0 auto 42px;
    box-sizing: border-box;

    opacity: 0;
    transform: rotate(-360deg) scale(0.04);
    transform-origin: center center;
    will-change: opacity, transform;
    backface-visibility: hidden;
}

/* 表示済みの状態です */
.service-rotate-block.is-visible {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

/* 中央揃え用です */
.service-rotate-block--center {
    text-align: center;
}

.service-rotate-block p,
.service-rotate-block h2,
.service-rotate-block h3 {
    margin-left: auto;
    margin-right: auto;
}

/* アニメーション無効設定の利用者向けです */
@media (prefers-reduced-motion: reduce) {
    .service-rotate-block {
        opacity: 1;
        transform: none;
        animation: none;
    }

    .service-rotate-block.is-visible {
        animation: none;
    }
}

/* スマートフォンでは開始サイズだけ少し大きくします */
@media screen and (max-width: 767px) {
    .service-rotate-block {
        transform: rotate(-270deg) scale(0.08);
    }
}

/* メイン見出しです */
.service-main-title {
    margin: 0;
    font-family: var(--font-base);
    font-size: 38px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.06em;
    color: #3f302b;
}

/* 大きめ説明文です */
.service-lead-text {
    width: min(100%, var(--services-text-width));
    max-width: var(--services-text-width);
    margin: 0 auto;
    font-family: var(--font-base);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.04em;
    color: #3f302b;
}

/* 最後の説明文です */
.service-detail-text {
    width: min(100%, var(--services-text-width));
    max-width: var(--services-text-width);
    margin: 0 auto;
    font-family: var(--font-base);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.03em;
    color: #3f302b;
    text-align: left;
}

/* 通常画像です */
.service-image-large {
    max-width: var(--services-media-width);
    margin: 30px auto 42px;
}

.service-image-large img {
    display: block;
    width: 100%;
    height: auto;
}

/* 動画ブロックです */
.service-video-wrap {
    max-width: var(--services-media-width);
    margin: 28px auto 46px;
}

.service-video-wrap--wide {
    max-width: var(--services-media-wide-width);
}

.service-video {
    display: block;
    width: 100%;
    height: auto;
    background: #000000;
    border: 3px solid #0b4a86;
    box-sizing: border-box;
}

/* アニメーション無効設定の利用者向けです */
@media (prefers-reduced-motion: reduce) {
    .service-rotate-block {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-services {
        padding: 22px 0 40px;
    }

    .page-services__inner {
        padding: 0 28px;
    }

    .page-services__title {
        font-size: 44px;
    }

    .page-services__body {
        font-size: 20px;
    }

    .service-main-title {
        font-size: 34px;
    }

    .service-lead-text {
        font-size: 25px;
    }

    .service-detail-text {
        font-size: 22px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-services {
        padding: 20px 0 36px;
    }

    .page-services__inner {
        padding: 0 18px;
    }

    .page-services__header {
        margin-bottom: 22px;
    }

    .page-services__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.03em;
    }

    .page-services__line {
        width: 100%;
        height: 4px;
    }

    .page-services__body {
        font-size: 17px;
        line-height: 1.8;
    }

    .service-rotate-block {
        margin-bottom: 34px;
        transform: perspective(700px) rotateY(-52deg) scale(0.9);
    }

    .service-main-title {
        font-size: 25px;
        line-height: 1.55;
    }

    .service-lead-text {
        font-size: 20px;
        line-height: 1.75;
    }

    .service-detail-text {
        font-size: 18px;
        line-height: 1.8;
    }

    .service-image-large,
    .service-video-wrap,
    .service-video-wrap--wide {
        max-width: 100%;
    }
}

/* ============================================================
   Services Page Title Depth Spring Animation
   見出しを奥行き方向に、止まり感を抑えて滑らかにバウンドさせます
   ============================================================ */

/* 見出しの初期状態です */
.page-services__title {
    opacity: 0;
    transform: scale(0.12);
    transform-origin: center center;
    will-change: opacity, transform;
    backface-visibility: hidden;
}

/* JS側の Web Animations API で動かすため、CSSアニメーションは持たせません */
.page-services__title.is-depth-bounce-visible {
    opacity: 1;
}

/* アニメーション完了後はtransformを解除し、文字のにじみを防ぎます */
.page-services__title.is-depth-bounce-finished {
    opacity: 1;
    transform: none;
    animation: none;
}

/* アニメーション無効設定の利用者向けです */
@media (prefers-reduced-motion: reduce) {
    .page-services__title,
    .page-services__title.is-depth-bounce-visible,
    .page-services__title.is-depth-bounce-finished {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

/* ============================================================
   Services Page Image Reveal Animation
   金属プレス加工の説明図を表示時に回転・拡大表示します
   ============================================================ */

/* 説明図の初期状態です */
.service-image-large {
    opacity: 0;
    transform: translate(160px, 180px) rotate(42deg) scale(0.08);
    transform-origin: center center;
    will-change: opacity, transform;
    backface-visibility: hidden;
}

/* 表示完了後の状態です */
.service-image-large.is-image-reveal-finished {
    opacity: 1;
    transform: none;
}

/* アニメーション無効設定の利用者向けです */
@media (prefers-reduced-motion: reduce) {
    .service-image-large,
    .service-image-large.is-image-reveal-finished {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

/* ============================================================
   Services Page Image Center Left-Turn Perspective Reveal
   説明図を奥から手前へ、逆回転・大ぶり・滑らかに表示します
   ============================================================ */

.service-image-large {
    display: block;
    margin: 30px auto 42px;
    opacity: 0;
    transform:
        perspective(1500px)
        translate3d(0, 0, -520px)
        rotateY(88deg)
        rotateZ(0deg)
        scale(0.82);
    transform-origin: center center;
    transform-style: preserve-3d;
    will-change: opacity, transform;
    backface-visibility: hidden;
}

.service-image-large.is-image-reveal-finished {
    opacity: 1;
    transform: none;
}

@media (max-width: 767px) {
    .service-image-large {
        transform:
            perspective(1200px)
            translate3d(0, 0, -380px)
            rotateY(86deg)
            rotateZ(0deg)
            scale(0.84);
    }
}

@media (prefers-reduced-motion: reduce) {
    .service-image-large,
    .service-image-large.is-image-reveal-finished {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

/* ============================================================
   Services Page Title Elegant Neon Strong Red Edge 3px
   上品寄り：青・紫・白銀系に赤銅系の太め縁取りを加えます
   ============================================================ */

/* 見出し全体です */
.page-services__title {
    position: relative;
    color: #f2f7ff;
    text-align: center;
    line-height: 1.25;
    letter-spacing: 0.04em;

    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.95),

        /* 赤銅系の太め縁取りです */
        1px 0 0 rgba(120, 45, 65, 0.44),
        -1px 0 0 rgba(120, 45, 65, 0.44),
        0 1px 0 rgba(120, 45, 65, 0.44),
        0 -1px 0 rgba(120, 45, 65, 0.36),
        2px 0 0 rgba(120, 45, 65, 0.34),
        -2px 0 0 rgba(120, 45, 65, 0.34),
        0 2px 0 rgba(120, 45, 65, 0.42),
        0 -2px 0 rgba(120, 45, 65, 0.26),
        3px 0 0 rgba(120, 45, 65, 0.22),
        -3px 0 0 rgba(120, 45, 65, 0.22),
        0 3px 0 rgba(120, 45, 65, 0.30),
        0 -3px 0 rgba(120, 45, 65, 0.18),

        0 0 4px rgba(255, 255, 255, 0.48),
        0 0 10px rgba(150, 190, 255, 0.24);
}

/* 1文字ずつの共通設定です */
.page-services__title .services-title-char {
    display: inline-block;
    position: relative;
    font-weight: 700;
    opacity: 1;
    transform-origin: center center;
    will-change: color, text-shadow, filter, transform;

    animation:
        services-title-elegant-strong-neon-flicker 6.8s ease-in-out infinite,
        services-title-elegant-strong-float 6.8s ease-in-out infinite;

    animation-delay:
        calc(var(--char-index) * 0.06s),
        calc(var(--char-index) * 0.06s);
}

.page-services__title .services-title-char--space {
    width: 0.45em;
}

/* 青白 + 赤銅縁取り */
.page-services__title .services-title-char:nth-child(4n + 1) {
    color: #eefaff;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 1),

        1px 0 0 rgba(135, 45, 65, 0.52),
        -1px 0 0 rgba(135, 45, 65, 0.52),
        0 1px 0 rgba(135, 45, 65, 0.52),
        0 -1px 0 rgba(135, 45, 65, 0.42),
        2px 0 0 rgba(135, 45, 65, 0.40),
        -2px 0 0 rgba(135, 45, 65, 0.40),
        0 2px 0 rgba(135, 45, 65, 0.50),
        0 -2px 0 rgba(135, 45, 65, 0.30),
        3px 0 0 rgba(135, 45, 65, 0.26),
        -3px 0 0 rgba(135, 45, 65, 0.26),
        0 3px 0 rgba(135, 45, 65, 0.36),
        0 -3px 0 rgba(135, 45, 65, 0.20),

        0 0 3px rgba(255, 255, 255, 0.72),
        0 0 8px rgba(120, 220, 255, 0.42),
        0 0 15px rgba(120, 220, 255, 0.22);
}

/* 淡いブルー + 赤紫縁取り */
.page-services__title .services-title-char:nth-child(4n + 2) {
    color: #d5e6ff;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.98),

        1px 0 0 rgba(120, 40, 75, 0.50),
        -1px 0 0 rgba(120, 40, 75, 0.50),
        0 1px 0 rgba(120, 40, 75, 0.50),
        0 -1px 0 rgba(120, 40, 75, 0.40),
        2px 0 0 rgba(120, 40, 75, 0.38),
        -2px 0 0 rgba(120, 40, 75, 0.38),
        0 2px 0 rgba(120, 40, 75, 0.48),
        0 -2px 0 rgba(120, 40, 75, 0.30),
        3px 0 0 rgba(120, 40, 75, 0.25),
        -3px 0 0 rgba(120, 40, 75, 0.25),
        0 3px 0 rgba(120, 40, 75, 0.34),
        0 -3px 0 rgba(120, 40, 75, 0.20),

        0 0 3px rgba(245, 250, 255, 0.62),
        0 0 8px rgba(135, 175, 255, 0.38),
        0 0 15px rgba(135, 175, 255, 0.20);
}

/* 淡い紫 + ワインレッド縁取り */
.page-services__title .services-title-char:nth-child(4n + 3) {
    color: #e1d6ff;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.98),

        1px 0 0 rgba(115, 35, 85, 0.50),
        -1px 0 0 rgba(115, 35, 85, 0.50),
        0 1px 0 rgba(115, 35, 85, 0.50),
        0 -1px 0 rgba(115, 35, 85, 0.40),
        2px 0 0 rgba(115, 35, 85, 0.38),
        -2px 0 0 rgba(115, 35, 85, 0.38),
        0 2px 0 rgba(115, 35, 85, 0.46),
        0 -2px 0 rgba(115, 35, 85, 0.28),
        3px 0 0 rgba(115, 35, 85, 0.24),
        -3px 0 0 rgba(115, 35, 85, 0.24),
        0 3px 0 rgba(115, 35, 85, 0.32),
        0 -3px 0 rgba(115, 35, 85, 0.18),

        0 0 3px rgba(250, 245, 255, 0.64),
        0 0 8px rgba(175, 145, 255, 0.38),
        0 0 15px rgba(175, 145, 255, 0.20);
}

/* 白銀 + ローズブラウン縁取り */
.page-services__title .services-title-char:nth-child(4n + 4) {
    color: #f7f9ff;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 1),

        1px 0 0 rgba(125, 50, 70, 0.52),
        -1px 0 0 rgba(125, 50, 70, 0.52),
        0 1px 0 rgba(125, 50, 70, 0.52),
        0 -1px 0 rgba(125, 50, 70, 0.42),
        2px 0 0 rgba(125, 50, 70, 0.40),
        -2px 0 0 rgba(125, 50, 70, 0.40),
        0 2px 0 rgba(125, 50, 70, 0.50),
        0 -2px 0 rgba(125, 50, 70, 0.30),
        3px 0 0 rgba(125, 50, 70, 0.26),
        -3px 0 0 rgba(125, 50, 70, 0.26),
        0 3px 0 rgba(125, 50, 70, 0.36),
        0 -3px 0 rgba(125, 50, 70, 0.20),

        0 0 3px rgba(255, 255, 255, 0.70),
        0 0 8px rgba(190, 210, 255, 0.34),
        0 0 15px rgba(190, 210, 255, 0.18);
}

/* 落ち着いた発光です */
@keyframes services-title-elegant-strong-neon-flicker {
    0%,
    100% {
        opacity: 1;
        filter: saturate(1.00) brightness(1.00) contrast(1.06);
    }

    24% {
        opacity: 1;
        filter: saturate(1.08) brightness(1.08) contrast(1.10);
    }

    44% {
        opacity: 0.98;
        filter: saturate(0.96) brightness(0.99) contrast(1.08);
    }

    64% {
        opacity: 1;
        filter: saturate(1.10) brightness(1.07) contrast(1.10);
    }

    82% {
        opacity: 0.99;
        filter: saturate(0.98) brightness(1.00) contrast(1.08);
    }
}

/* ごくわずかな浮遊感です */
@keyframes services-title-elegant-strong-float {
    0%,
    100% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-0.25px) scale(1.001);
    }
}

/* ホバー時も上品な範囲で少しだけ強調します */
.page-services__title:hover .services-title-char {
    filter: saturate(1.12) brightness(1.08) contrast(1.12);
}

/* 動きを減らしたい環境向けです */
@media (prefers-reduced-motion: reduce) {
    .page-services__title .services-title-char {
        animation: none;
        opacity: 1;
        filter: none;
        transform: none;
    }
}

/* ============================================================
   17. Service Detail Pages
   業務内容配下6ページ共通レイアウト
   ============================================================ */

/* 業務内容詳細ページで使う幅です。
   文字の開始位置を全ページで揃えるため、本文幅をここで一元管理します。 */
:root {
    --service-detail-text-width: 860px;
    --service-detail-media-width: 760px;
    --service-detail-media-wide-width: 860px;

    /* 青線の左右余白です。
       数値を大きくすると青線が短くなります。 */
    --service-detail-line-side-gap: 28px;
}

/* テーマ側で自動表示される標準H1を非表示にします */
.page-template-page-service-detail #main-content > h1:first-child,
.page-template-page-service-detail main > h1:first-child,
.page-template-page-service-detail article > h1:first-child,
.page-template-page-service-detail .content-area > h1:first-child,
.page-template-page-service-detail .site-main > h1:first-child,
.page-template-page-service-detail .entry-title,
.page-template-page-service-detail h1.entry-title,
.page-template-page-service-detail .wp-block-post-title {
    display: none !important;
}

/* ページ全体です */
.page-service-detail {
    background: #efefef;
    padding: 24px 0 42px;
}

/* メニュー両端幅に合わせる外枠です */
.page-service-detail__section {
    width: 100%;
}

.page-service-detail__inner {
    max-width: var(--content-edge-width, 1020px);
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
}

/* タイトル周辺です */
.page-service-detail__header {
    max-width: var(--content-edge-width, 1020px);
    width: 100%;
    margin: 0 auto 26px;
    text-align: center;
    box-sizing: border-box;
}

.page-service-detail__title {
    margin: 0 0 18px;
    font-family: var(--font-mincho);
    font-size: 54px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.04em;
    color: #111111;
}

/* タイトル下の紺色ラインです */
.page-service-detail__line {
    width: calc(100% - (var(--service-detail-line-side-gap) * 2));
    height: 5px;
    margin: 0 auto;
    border-radius: 999px;
    background: #0b4a86;
}

/* 固定ページ本文全体です */
.page-service-detail__content {
    max-width: var(--content-edge-width, 1020px);
    width: 100%;
    margin: 0 auto;
    padding-top: 0;
    box-sizing: border-box;
}

.page-service-detail__body {
    font-family: var(--font-base);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.03em;
    color: #222222;
}

/* Gutenberg本文の基本余白です */
.page-service-detail__body > *:first-child {
    margin-top: 0;
}

.page-service-detail__body > *:last-child {
    margin-bottom: 0;
}

.page-service-detail__body p {
    margin: 0 0 1.45em;
}

/* 共通の説明テキストです。
   本文の開始位置はここで統一します。 */
.service-detail-text {
    width: min(100%, var(--service-detail-text-width));
    max-width: var(--service-detail-text-width);
    margin: 0 auto 34px;
    box-sizing: border-box;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.03em;
    color: #222222;
}

.service-detail-text p {
    margin: 0 0 1.35em;
}

.service-detail-text p:last-child {
    margin-bottom: 0;
}

/* 中央寄せ文章用です */
.service-detail-text--center {
    text-align: center;
}

/* 互換用です。
   以前のサンプルで使っていた場合でも、本文開始位置がズレないよう幅は変えません。 */
.service-detail-text--compact {
    width: min(100%, var(--service-detail-text-width));
    max-width: var(--service-detail-text-width);
}

/* 箇条書きエリアです。
   単独で置いても、本文内に置いても、開始位置を揃えます。 */
.service-detail-list {
    width: min(100%, var(--service-detail-text-width));
    max-width: var(--service-detail-text-width);
    margin: 0 auto 28px;
    padding-left: 1.5em;
    box-sizing: border-box;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.7;
}

/* service-detail-text 内に service-detail-list がある場合、二重中央寄せを防ぎます */
.service-detail-text .service-detail-list {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

.service-detail-list li {
    margin-bottom: 0.35em;
}

/* 段落やリストの先頭上余白を消し、ページごとの開始位置ズレを抑えます */
.service-detail-text > p:first-child,
.service-detail-text > ul:first-child,
.service-detail-text > ol:first-child,
.service-detail-list > li:first-child,
.page-service-detail__body > p:first-child,
.page-service-detail__body > ul:first-child,
.page-service-detail__body > ol:first-child {
    margin-top: 0;
}

/* 動画見出しです */
.service-detail-subtitle {
    width: min(100%, var(--service-detail-text-width));
    max-width: var(--service-detail-text-width);
    margin: 34px auto 18px;
    box-sizing: border-box;

    font-family: var(--font-base);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.04em;
    color: #111111;
    text-align: left;
}

/* 通常画像です */
.service-detail-image {
    max-width: var(--service-detail-media-width);
    margin: 28px auto 42px;
}

.service-detail-image img {
    display: block;
    width: 100%;
    height: auto;
    border: 3px solid #0b4a86;
    box-sizing: border-box;
}

/* 画像を大きめに見せる場合です */
.service-detail-image--wide {
    max-width: var(--service-detail-media-wide-width);
}

/* 動画ブロックです */
.service-detail-video-wrap {
    max-width: var(--service-detail-media-width);
    margin: 20px auto 46px;
}

.service-detail-video-wrap--wide {
    max-width: var(--service-detail-media-wide-width);
}

.service-detail-video {
    display: block;
    width: 100%;
    height: auto;
    background: #000000;
    border: 3px solid #0b4a86;
    box-sizing: border-box;
}

/* ============================================================
   Service Detail Slider
   共通スライドショー
   ============================================================ */

.yk-media-slider {
    position: relative;
    width: 100%;
    max-width: var(--service-detail-media-width);
    margin: 30px auto 42px;
    background: #ffffff;
    overflow: hidden;
}

.yk-media-slider--wide {
    max-width: var(--service-detail-media-wide-width);
}

.yk-media-slider--narrow {
    max-width: 640px;
}

.yk-media-slider__viewport {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #ffffff;
}

.yk-media-slider--square .yk-media-slider__viewport {
    aspect-ratio: 4 / 3;
}

.yk-media-slider--wide .yk-media-slider__viewport {
    aspect-ratio: 16 / 9;
}

.yk-media-slider__slide {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.55s ease;
}

.yk-media-slider__slide.is-active {
    opacity: 1;
    pointer-events: auto;
}

.yk-media-slider__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 画像左上ラベルです */
.yk-media-slider__slide figcaption,
.yk-media-slider__slide .yk-media-slider__caption {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;
    max-width: calc(100% - 32px);
    padding: 10px 20px;
    background: var(--yk-slide-title-bg, #17335c);
    color: var(--yk-slide-title-color, #ffffff);
    border-radius: 10px;
    font-family: var(--font-base);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: 0.04em;
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.25);
    white-space: pre-line;
    margin: 0;
    text-align: center;
    min-width: 150px;
    box-sizing: border-box;
}


/* 左右ボタンです */
.yk-media-slider__button {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 42px;
    height: 64px;
    border: 0;
    transform: translateY(-50%);
    background: rgba(23, 51, 92, 0.58);
    color: #ffffff;
    font-family: var(--font-base);
    font-size: 44px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.18s ease, transform 0.18s ease;
}

.yk-media-slider__button--prev {
    left: 0;
    border-radius: 0 10px 10px 0;
}

.yk-media-slider__button--next {
    right: 0;
    border-radius: 10px 0 0 10px;
}

.yk-media-slider__button:hover,
.yk-media-slider__button:focus {
    background: rgba(243, 152, 0, 0.88);
}

.yk-media-slider__button:active {
    transform: translateY(-50%) scale(0.96);
}

/* ドットです */
.yk-media-slider__dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    z-index: 4;
    display: flex;
    justify-content: center;
    gap: 9px;
    pointer-events: auto;
}

.yk-media-slider__dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.58);
    cursor: pointer;
}

.yk-media-slider__dot.is-active {
    background: #f39800;
}

/* スライドが1枚だけの場合は操作部品を隠します */
.yk-media-slider.is-single .yk-media-slider__button,
.yk-media-slider.is-single .yk-media-slider__dots {
    display: none;
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .page-service-detail {
        padding: 22px 0 40px;
    }

    .page-service-detail__inner {
        padding: 0 28px;
    }

    .page-service-detail__title {
        font-size: 44px;
    }

    .page-service-detail__body,
    .service-detail-text,
    .service-detail-list {
        font-size: 20px;
    }

    .service-detail-subtitle {
        font-size: 25px;
    }

    .yk-media-slider__slide figcaption {
        font-size: 18px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .page-service-detail {
        padding: 20px 0 36px;
    }

    .page-service-detail__inner {
        padding: 0 18px;
    }

    .page-service-detail__header {
        margin-bottom: 22px;
    }

    .page-service-detail__title {
        margin-bottom: 14px;
        font-size: 34px;
        letter-spacing: 0.03em;
    }

    .page-service-detail__line {
        width: 100%;
        height: 4px;
    }

    .page-service-detail__body,
    .service-detail-text,
    .service-detail-list {
        font-size: 17px;
        line-height: 1.8;
    }

    .service-detail-list {
        padding-left: 1.3em;
    }

    .service-detail-subtitle {
        margin-top: 28px;
        font-size: 21px;
        text-align: center;
    }

    .yk-media-slider,
    .yk-media-slider--wide,
    .yk-media-slider--narrow,
    .service-detail-video-wrap,
    .service-detail-video-wrap--wide,
    .service-detail-image,
    .service-detail-image--wide {
        max-width: 100%;
    }

    .yk-media-slider__viewport,
    .yk-media-slider--wide .yk-media-slider__viewport {
        aspect-ratio: 4 / 3;
    }

    .yk-media-slider__button {
        width: 34px;
        height: 52px;
        font-size: 36px;
    }

    .yk-media-slider__slide figcaption {
        top: 10px;
        left: 10px;
        padding: 8px 14px;
        font-size: 15px;
        border-radius: 8px;
    }

    .yk-media-slider__dots {
        bottom: 10px;
        gap: 7px;
    }

    .yk-media-slider__dot {
        width: 9px;
        height: 9px;
    }
}

/* ============================================================
   特注品・アール加工
   本文左・画像右レイアウト調整版
   青線幅内に収め、右画像を少し下げ、下段との余白を確保します
   ============================================================ */

.service-detail-layout-with-side-images {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 224px !important;
    gap: 24px !important;
    align-items: start !important;
    max-width: 860px !important;
    margin: 0 auto 48px !important;
}

/* 左側本文 */
.service-detail-layout-with-side-images .service-detail-text {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    min-width: 0 !important;
}

/* 左側本文の行間を整えます */
.service-detail-layout-with-side-images .service-detail-text p {
    line-height: 1.9 !important;
}

/* 箇条書きを太文字にします */
.service-detail-layout-with-side-images .service-detail-list li {
    font-weight: 700 !important;
    line-height: 1.9 !important;
}

/* 右側画像エリア */
.service-detail-side-image-area {
    display: flex !important;
    flex-direction: column !important;
    gap: 28px !important;

    width: 224px !important;
    max-width: 224px !important;

    /* 右側ミニ画像を「2022年に新たに〜」付近から表示します */
    margin-top: 200px !important;

    /* 下段スライドショーと詰まらないようにします */
    margin-bottom: 4px !important;
}

/* 右側画像だけ既存の service-detail-image 幅指定を解除します */
.service-detail-side-image-area .service-detail-image {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* 右側画像 */
.service-detail-side-image-area .service-detail-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
}

/* 右側キャプション */
.service-detail-side-image-area .service-detail-image figcaption {
    display: inline-block !important;
    margin-top: 8px !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

/* このレイアウト直後のDBスライドショーは、必ず下に回します */
.service-detail-layout-with-side-images + .yk-media-slider,
.service-detail-layout-with-side-images + .yk-media-slider[data-yk-service-slider="1"] {
    clear: both !important;
    margin-top: 28px !important;
}

/* DB管理スライドショーの幅を青線幅に合わせます */
.yk-media-slider[data-yk-service-slider="1"] {
    width: 80% !important;
    max-width: 800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* スマホでは縦並び */
@media screen and (max-width: 767px) {
    .service-detail-layout-with-side-images {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
        margin-bottom: 36px !important;
    }

    .service-detail-side-image-area {
        width: 100% !important;
        max-width: 360px !important;
        margin: 18px auto 30px !important;
    }

    .yk-media-slider[data-yk-service-slider="1"] {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ============================================================
   単発式プレス・タップ・ロボット
   本文・スライドショー・動画調整
   ============================================================ */

/* 箇条書きの内容を太文字にします */
.service-detail-list li {
    font-weight: 700 !important;
    line-height: 1.9 !important;
}

/* 本文の行間を整えます */
.service-detail-text.service-detail-text--compact {
    line-height: 1.9 !important;
}

/* DB管理スライドショーの幅を調整します */
.yk-media-slider[data-yk-service-slider="1"] {
    width: 86% !important;
    max-width: 860px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 動画ブロック */
.service-video-block {
    width: 80% !important;
    max-width: 800px !important;
    margin: 34px auto 42px !important;
}

/* 動画タイトル */
.service-video-title {
    margin: 0 0 14px !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

/* 動画本体 */
.service-video-block video {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border: 3px solid #003f70 !important;
    box-sizing: border-box !important;
    background: #000000 !important;
}

/* スマホでは幅を戻します */
@media screen and (max-width: 767px) {
    .yk-media-slider[data-yk-service-slider="1"],
    .service-video-block {
        width: 100% !important;
        max-width: 100% !important;
    }

    .service-video-title {
        font-size: 18px !important;
    }
}

/* ============================================================
   追加調整：業務案内 DBスライドショー 説明文表示
   slide_descriptionを画像上に重ね、表示位置を選択できるようにします。
   ============================================================ */

.yk-media-slider[data-yk-service-slider="1"] {
    width: 86% !important;
    max-width: 860px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 説明文共通です */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description {
    position: absolute;
    z-index: 3;
    max-width: min(620px, calc(100% - 96px));
    padding: 8px 14px;
    background: var(--yk-slide-description-bg, #0b4a86);
    color: var(--yk-slide-description-color, #ffffff);
    border-radius: 10px;
    font-family: var(--font-base);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.02em;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
    box-sizing: border-box;
    text-align: left;
    white-space: pre-line;
    margin: 0;
}


/* 左下です。キャプションが左上にあるため、標準位置にします。 */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description--bottom_left {
    left: 18px;
    bottom: 46px;
}

/* 右上です。キャプション左上との重なりを避けます。 */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description--top_right {
    top: 18px;
    right: 18px;
    max-width: min(520px, calc(100% - 96px));
}

/* 右下です。 */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description--bottom_right {
    right: 18px;
    bottom: 46px;
    max-width: min(520px, calc(100% - 96px));
}

/* 左上です。キャプションがある場合は下へずらして重なりにくくします。 */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description--top_left {
    left: 18px;
    top: 18px;
}

.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__slide figcaption + .yk-media-slider__description--top_left {
    top: 84px;
}

/* 左上ラベルと説明文が両方ある場合に見やすくします */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__slide figcaption {
    z-index: 4;
}

/* 説明文が長い場合でもドットと重なりすぎないようにします */
.yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__dots {
    z-index: 5;
}

/* スマートフォンでは説明文を読みやすくします */
@media screen and (max-width: 767px) {
    .yk-media-slider[data-yk-service-slider="1"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    .yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description {
        left: 10px !important;
        right: 10px !important;
        bottom: 42px !important;
        top: auto !important;
        max-width: none !important;
        padding: 7px 10px !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
    }
}

/* 業務案内 詳細ページの箇条書きを強めにします */
body .service-detail-text.service-detail-text--compact ul.service-detail-list > li,
body .service-detail-text.service-detail-text--compact ul.service-detail-list > li * {
    font-weight: 800 !important;
    line-height: 1.9 !important;
}

/* 特注品・アール加工の右側ミニ画像調整の現在値です */
.service-detail-side-image-area {
    margin-top: 200px !important;
    margin-bottom: 4px !important;
}

/* スマートフォンでは説明文を画像下部の横幅いっぱいに近づけます */
@media screen and (max-width: 767px) {
    .yk-media-slider[data-yk-service-slider="1"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    .yk-media-slider[data-yk-service-slider="1"] .yk-media-slider__description {
        left: 10px;
        right: 10px;
        bottom: 42px;
        max-width: none;
        padding: 7px 10px;
        font-size: 13px;
        line-height: 1.45;
    }
}


/* ============================================================
   追加調整：採用情報入口ページ・採用情報リスト（横並び修正版）
   ★ヘッダー：文字を左下にまとめ、顔への被りを回避＋虹色影を追加
   ★リスト：PC環境で2列化し、金額の【横】にワイドボタンを配置
   ============================================================ */

/* 採用情報関連ページ・要素がある場合にテーマ側の標準タイトルを抑制 */
.page-template-page-recruit #main-content > h1:first-child,
.page-template-page-recruit main > h1:first-child,
.page-template-page-recruit article > h1:first-child,
.page-template-page-recruit .entry-title,
.page-template-page-recruit h1.entry-title,
.page-template-page-recruit .wp-block-post-title,
.page-recruit .entry-title,
.page-recruit h1.entry-title,
.page-recruit .wp-block-post-title,
body[class*="recruit"] .entry-title,
body[class*="saiyo"] .entry-title,
body:has(.yk-recruit-entry) .entry-title,
body:has(.yk-recruit-entry) h1.entry-title,
body:has(.yk-recruit-entry) .wp-block-post-title,
body:has(.yk-recruit-entry) #main-content > h1:first-child,
body:has(.yk-recruit-entry) main > h1:first-child,
body:has(.yk-recruit-entry) article > h1:first-child {
    display: none !important;
}

/* 全体コンテナ（赤枠部分の余白を詰める調整） */
.yk-recruit-entry {
    max-width: 860px;
    margin: 0 auto 0px !important;
    padding: 0 0 0px !important;
    box-sizing: border-box;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ヒーロー画像 */
.yk-recruit-entry .yk-recruit-hero {
    position: relative;
    width: 94% !important;
    max-width: 820px !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
    margin: 0 auto 22px !important;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
}

/* 左下から斜めに黒いグラデーションをかけ、文字ベースを浮き立たせる */
.yk-recruit-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(45deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0) 80%);
}

/* 配置を「左下」に変更 */
.yk-recruit-entry .yk-recruit-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 4% 6%;
    color: #ffffff;
    text-align: left;
    box-sizing: border-box;
    pointer-events: none;
}

/* 「採用情報」の文字に少し虹色な感じのグラデーション影を追加 */
.yk-recruit-hero__title {
    margin: 0 0 12px;
    font-family: var(--font-base);
    font-size: clamp(34px, 4.5vw, 54px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.04em;
    text-shadow: 
        1px 1px 2px rgba(0, 0, 0, 0.9),
        0px 0px 4px rgba(0, 0, 0, 0.7),
        -3px -3px 6px rgba(255, 99, 132, 0.75),
        3px -3px 6px rgba(255, 205, 86, 0.75),
        3px 3px 6px rgba(75, 192, 192, 0.75),
        -3px 3px 6px rgba(54, 162, 235, 0.75),
        0px 4px 10px rgba(153, 102, 255, 0.6);
}

/* メッセージの幅制限＋文字の影 */
.yk-recruit-entry .yk-recruit-hero__message {
    margin: 0;
    font-family: var(--font-base);
    font-size: clamp(16px, 2.05vw, 23px);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
    max-width: 620px;
    margin-left: 0;
    margin-right: auto;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}

/* message_line1 / message_line2 を使う場合、指定した行を崩さず表示します */
.yk-recruit-entry .yk-recruit-hero__message-line {
    display: block;
    white-space: nowrap;
}


/* ヘッダー・メッセージ */
.yk-recruit-entry__header {
    padding: 42px 0 28px;
    text-align: left;
}

.yk-recruit-entry__title {
    margin: 0 0 18px;
    font-family: var(--font-base);
    font-size: 40px;
    font-weight: 700;
    color: #17335c;
}

.yk-recruit-entry__message {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.8;
}

/* 求人リスト：PC/タブレット環境での2列グリッド設定 */
.yk-recruit-entry .yk-recruit-list {
    width: 94% !important;
    max-width: 820px !important;
    margin: 18px auto 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.yk-recruit-entry > .yk-recruit-list:first-child {
    margin-top: 0;
}

/* ★各求人カード：カード全体を「左側テキスト」と「右側ボタン」で確実に横並びにする */
.yk-recruit-card {
    display: flex !important;
    flex-direction: row !important; /* 強制的に横並び */
    justify-content: space-between !important; /* 両端に引き離す */
    align-items: flex-end !important; /* 下側のラインを揃える */
    margin: 0;
    padding: 22px 24px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 8px; 
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.yk-recruit-card:not(:last-child) {
    margin-bottom: 0;
}

/* カードにマウスを乗せたときの浮き上がりエフェクト */
.yk-recruit-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

/* 左側のテキストエリア */
.yk-recruit-card__body {
    min-width: 0;
    flex: 1 !important; /* 横幅いっぱいに広げる */
    padding-right: 12px; /* ボタンとの間の最低限の隙間 */
}

/* カード内のタイトル */
.yk-recruit-card__title {
    margin: 0 0 12px;
    font-family: var(--font-base);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
    color: #17335c;
}

.yk-recruit-card__label {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    color: #666666;
}

.yk-recruit-card__salary {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    color: #d9534f;
    white-space: nowrap; /* 金額の変な改行を防止 */
}

.yk-recruit-card__note {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.6;
    color: #555555;
}

/* 右側のボタンエリア */
.yk-recruit-card__action {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    flex-shrink: 0 !important; /* ボタンが潰れるのを防ぐ */
}

/* 詳細ボタン：幅をワイドにしてベタ塗りにアレンジ */
.yk-recruit-card__button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 105px; /* ワイド幅 */
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #9f5a50;
    border-radius: 4px;
    background: #9f5a50;
    color: #ffffff;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-sizing: border-box;
    font-size: 0; /* 元の「詳細」を消す */
    transition: background 0.16s ease, border-color 0.16s ease;
}

/* 「詳細を見る」に書き換え */
.yk-recruit-card__button::after {
    content: "詳細を見る";
    font-size: 13px;
}

/* カード全体ホバー時にボタンの色も連動 */
.yk-recruit-card:hover .yk-recruit-card__button {
    background: #86463d;
    border-color: #86463d;
}

.nav-menu .sub-menu a[href*="recruit"],
.footer-menu .sub-menu a[href*="recruit"] {
    font-weight: 700;
}

/* ============================================================
   レスポンシブ対応
   ============================================================ */

/* タブレット向け */
@media screen and (max-width: 1024px) {
    .yk-recruit-entry {
        max-width: calc(100% - 56px);
    }
}

/* スマートフォン向け（スマホ時は縦並びに戻してボタンを下に配置） */
@media screen and (max-width: 767px) {
    .yk-recruit-entry {
        max-width: calc(100% - 32px);
        margin-bottom: 0px !important;
    }

    .yk-recruit-entry .yk-recruit-list {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    /* スマホは横幅が狭いので縦並びに安全に戻す */
    .yk-recruit-card {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 20px 18px;
    }

    .yk-recruit-card:hover {
        transform: none;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    }

    .yk-recruit-card__body {
        width: 100%;
        padding-right: 0;
    }
    
    .yk-recruit-card__action {
        margin-top: 14px !important;
        width: 100%;
    }
    
    .yk-recruit-card__button {
        width: 100%; /* スマホは押しやすさ最優先で横いっぱいに広げる */
    }

    .yk-recruit-entry .yk-recruit-hero {
        width: 100% !important;
        max-width: 100% !important;
        aspect-ratio: 16 / 10;
    }

    .yk-recruit-entry .yk-recruit-hero__overlay {
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 24px 18px;
    }
    
    .yk-recruit-hero::before {
        background: rgba(0, 0, 0, 0.45);
    }

    .yk-recruit-entry .yk-recruit-hero__message {
        max-width: 100%;
        margin: 0 auto;
    }
}


/* ============================================================
   追加調整：採用詳細ページ・応募フォーム
   職種ごとの詳細ページと共通応募ページです。
   ============================================================ */

/* 採用詳細ページ */
.yk-recruit-detail {
    max-width: 820px;
    margin: 0 auto 56px;
    color: #333333;
    font-family: var(--font-base);
}

.yk-recruit-detail__hero {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 5.2;
    overflow: hidden;
    background: #d8d8d8;
}

.yk-recruit-detail__hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yk-recruit-detail__hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.08);
}

.yk-recruit-detail__hero-title {
    position: absolute;
    right: 26px;
    bottom: 22px;
    z-index: 1;
    color: rgba(255, 120, 70, 0.88);
    font-family: var(--font-base);
    font-size: clamp(42px, 5.2vw, 72px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
    text-shadow:
        1px 1px 0 rgba(255, 255, 255, 0.55),
        0 3px 8px rgba(0, 0, 0, 0.22);
}

.yk-recruit-detail__back-area {
    margin: 10px 0 14px;
}

.yk-recruit-detail__back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    min-height: 22px;
    padding: 0 12px;
    border: 1px solid #f39800;
    border-radius: 999px;
    color: #f39800;
    background: #ffffff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.yk-recruit-detail__back:hover,
.yk-recruit-detail__back:focus {
    background: #f39800;
    color: #ffffff;
}

.yk-recruit-detail__content {
    width: 92%;
    margin: 0 auto;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.95;
    letter-spacing: 0.02em;
}

.yk-recruit-detail-section {
    margin: 0 0 30px;
}

.yk-recruit-detail-section__title {
    margin: 0 0 4px;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.45;
    color: #333333;
}

.yk-recruit-detail-section__body {
    white-space: normal;
}

.yk-recruit-detail__apply-area {
    display: flex;
    justify-content: center;
    margin: 34px auto 0;
}

.yk-recruit-detail__apply-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
    width: min(420px, 72%);
    min-height: 56px;
    border: 2px solid rgba(240, 128, 80, 0.78);
    border-radius: 999px;
    background: #ffc39d;
    color: #7d3b24;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.35em;
    text-decoration: none;
    box-sizing: border-box;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
    transition: transform 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.yk-recruit-detail__apply-button:hover,
.yk-recruit-detail__apply-button:focus {
    background: #f39800;
    color: #ffffff;
    transform: translateY(-2px);
}

.yk-recruit-detail__apply-icon {
    letter-spacing: 0;
}

.yk-recruit-detail-empty {
    max-width: 820px;
    margin: 40px auto;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}

/* 応募フォーム */
.yk-recruit-apply {
    max-width: 820px;
    margin: 0 auto 56px;
    padding: 34px 44px 42px;
    background: #ffffff;
    border: 1px solid rgba(120, 120, 120, 0.18);
    box-sizing: border-box;
}

.yk-recruit-apply__header {
    margin-bottom: 28px;
    text-align: center;
}

.yk-recruit-apply__title {
    margin: 0 0 8px;
    color: #17335c;
    font-size: 34px;
    font-weight: 700;
}

.yk-recruit-apply__lead {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
}

.yk-recruit-apply__message {
    margin: 0 0 22px;
    padding: 12px 16px;
    border-radius: 6px;
    font-weight: 700;
}

.yk-recruit-apply__message--success {
    background: #e9f7ed;
    color: #126b2e;
    border: 1px solid #9fd6ad;
}

.yk-recruit-apply__message--error {
    background: #fff1f1;
    color: #a11c1c;
    border: 1px solid #f1b7b7;
}

.yk-recruit-apply-form__row {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.yk-recruit-apply-form__row label {
    padding-top: 9px;
    font-size: 16px;
    font-weight: 700;
}

.yk-recruit-apply-form__row input,
.yk-recruit-apply-form__row select,
.yk-recruit-apply-form__row textarea {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid #cccccc;
    border-radius: 4px;
    background: #ffffff;
    font-family: var(--font-base);
    font-size: 16px;
    box-sizing: border-box;
}

.yk-recruit-apply-form__row textarea {
    min-height: 150px;
    resize: vertical;
}

.yk-recruit-apply-form__action {
    display: flex;
    justify-content: center;
    margin-top: 28px;
}

.yk-recruit-apply-form__action button {
    min-width: 220px;
    min-height: 48px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--menu-orange-top) 0%, var(--menu-orange-mid) 52%, var(--menu-orange-bottom) 100%);
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.45),
        0 4px 0 rgba(120, 70, 0, 0.32),
        0 7px 12px rgba(0, 0, 0, 0.18);
}

.yk-recruit-apply-form__action button:hover,
.yk-recruit-apply-form__action button:focus {
    transform: translateY(-2px);
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .yk-recruit-detail,
    .yk-recruit-apply {
        max-width: calc(100% - 32px);
    }

    .yk-recruit-detail__hero {
        aspect-ratio: 16 / 8;
    }

    .yk-recruit-detail__hero-title {
        right: 16px;
        bottom: 16px;
        font-size: 38px;
    }

    .yk-recruit-detail__content {
        width: 100%;
        font-size: 15px;
        line-height: 1.8;
    }

    .yk-recruit-detail__apply-button {
        width: 86%;
        gap: 28px;
        font-size: 20px;
    }

    .yk-recruit-apply {
        padding: 28px 18px 34px;
    }

    .yk-recruit-apply-form__row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .yk-recruit-apply-form__row label {
        padding-top: 0;
    }
}

/* ============================================================
   採用詳細ページ 最終調整
   戻るボタンを削除し、本文行間を本家寄せで詰めます。
   フォントサイズは前回比で約30%大きくしています。
   ============================================================ */
/* 採用詳細ページでは、固定ページ標準タイトルを非表示にします */
body:has(.yk-recruit-detail) .entry-title,
body:has(.yk-recruit-detail) h1.entry-title,
body:has(.yk-recruit-detail) .wp-block-post-title,
body:has(.yk-recruit-detail) #main-content > h1:first-child,
body:has(.yk-recruit-detail) main > h1:first-child,
body:has(.yk-recruit-detail) article > h1:first-child {
    display: none !important;
}

/* 詳細ページ全体を上へ詰めます */
body:has(.yk-recruit-detail) #main-content,
body:has(.yk-recruit-detail) .site-main,
body:has(.yk-recruit-detail) .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.yk-recruit-detail {
    max-width: 820px;
    margin: 0 auto 44px !important;
    padding-top: 0 !important;
}

/* 戻るボタンは表示しません */
.yk-recruit-detail__back-area,
.yk-recruit-detail__back {
    display: none !important;
}

/* ヘッダー画像は上部へ自然に寄せます */
.yk-recruit-detail__hero {
    margin-top: 0 !important;
}

/* 本文領域：幅を92%から100%に変更し、hero画像と揃えました */
.yk-recruit-detail__content {
    width: 100% !important;
    margin: 14px auto 0 !important;
    font-size: 21px !important;       /* 16px → 約30%増 */
    font-weight: 700 !important;
    line-height: 1.55 !important;
    letter-spacing: 0.02em !important;
}

/* セクション間隔です。文字を大きくした分だけ少し確保します */
.yk-recruit-detail-section {
    margin: 0 0 22px !important;
}

/* 見出しです。前回比で約30%大きくします */
.yk-recruit-detail-section__title {
    margin: 0 0 6px !important;
    padding: 0 !important;
    font-size: 27px !important;       /* 21px → 約30%増 */
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #333333 !important;
}

/* 案A寄せ：本文は自然な改行表示に戻します。
   PHP側の nl2br() で改行は反映されるため、pre-line は使いません。 */
.yk-recruit-detail-section__body {
    padding-left: 28px !important;
    font-size: 20px !important;       /* 15px → 約30%増 */
    font-weight: 700 !important;
    line-height: 1.6 !important;
    letter-spacing: 0.02em !important;
    white-space: normal !important;
    color: #333333 !important;
}

/* 本文中の改行が多くても、行間だけで過剰に広がらないようにします */
.yk-recruit-detail-section__body br {
    line-height: 1.2 !important;
}

/* 応募ボタンは中央に配置し、アイコンと文字の間隔を均等にします */
.yk-recruit-detail__apply-area {
    display: flex !important;
    justify-content: center !important;
    margin: 30px auto 0 !important;
}

/* 応募ボタン全体の枠組み（PC用） */
.yk-recruit-detail__apply-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 56px !important;
    text-align: center !important;
    padding: 0 0 0 38px !important;      /* PC用の押し出し量 */
}

/* 左側：アイコン部分 */
.yk-recruit-detail__apply-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    margin-right: -46px !important;       /* PC用のアイコン距離 */
    letter-spacing: 0 !important;
}

/* 中央：「応募」の文字部分 */
.yk-recruit-detail__apply-button > span:not(.yk-recruit-detail__apply-icon) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    letter-spacing: 1.5em !important;    /* PC用の文字間隔 */
    padding-left: 1.5em !important;
}

/* 右側のダミースペース */
.yk-recruit-detail__apply-button::after {
    content: "" !important;
    width: 24px !important;
    margin-left: -46px !important;       
    display: inline-block !important;
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .yk-recruit-detail {
        max-width: calc(100% - 32px);
        margin-bottom: 36px !important;
    }

    .yk-recruit-detail__content {
        width: 100%;
        margin-top: 14px !important;
        font-size: 20px !important;       /* 15px → 約30%増 */
        line-height: 1.5 !important;
    }

    .yk-recruit-detail-section {
        margin-bottom: 18px !important;
    }

    .yk-recruit-detail-section__title {
        font-size: 25px !important;
    }

    .yk-recruit-detail-section__body {
        padding-left: 16px !important;
        font-size: 20px !important;       /* 15px → 約30%増 */
        line-height: 1.55 !important;
    }

    /* ★スマホ応募ボタン全体の調整 */
    .yk-recruit-detail__apply-button {
        padding: 0 0 0 24px !important;   /* スマホの画面幅に合わせた押し出し量 */
    }

    /* ★スマホ時のアイコン距離をPC版の比率に同期 */
    .yk-recruit-detail__apply-icon {
        margin-right: -32px !important;   /* スマホ画面用に少しマイルドに接近 */
    }

    /* ★スマホ時の文字表示をPC版の比率に同期 */
    .yk-recruit-detail__apply-button > span:not(.yk-recruit-detail__apply-icon) {
        font-size: 20px !important;
        letter-spacing: 1.2em !important; /* スマホ画面でハミ出さない絶妙な広さに */
        padding-left: 1.2em !important;
    }

    /* ★スマホ時の右側ダミースペースの同期 */
    .yk-recruit-detail__apply-button::after {
        margin-left: -32px !important;    /* margin-rightと同じ数値に同期 */
    }
}

/* ============================================================
   従業員入口ページ 固定ページ標準見出し非表示
   入口カードを主役にするため、固定ページ側の標準見出しを非表示にします。
   ============================================================ */

body:has(.yk-employee-entry) .entry-title,
body:has(.yk-employee-entry) h1.entry-title,
body:has(.yk-employee-entry) .wp-block-post-title,
body:has(.yk-employee-entry) #main-content > h1:first-child,
body:has(.yk-employee-entry) main > h1:first-child,
body:has(.yk-employee-entry) article > h1:first-child {
    display: none !important;
}

body:has(.yk-employee-entry) #main-content,
body:has(.yk-employee-entry) .site-main,
body:has(.yk-employee-entry) .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ============================================================
   従業員の日常・従業員の声 入口ページ
   B案：画像大きめバナー型
   ============================================================ */

.yk-employee-entry {
    width: 100%;
    padding: 34px 0 56px;
    background: #efefef;
}

.yk-employee-entry__inner {
    width: min(1020px, calc(100% - 72px));
    margin: 0 auto;
}

.yk-employee-entry__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
}

/* 入口カードです */
.yk-employee-entry-card {
    position: relative;
    min-height: 380px;
    border-radius: 18px;
    overflow: hidden;
    background: #111111;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.13);
    isolation: isolate;
}

/* 背景画像です */
.yk-employee-entry-card__image {
    position: absolute;
    inset: 0;
    z-index: -3;
    background-color: #d8dee8;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    transform: scale(1.01);
}

/* 画像未指定時の仮背景です */
.yk-employee-entry-card--blog .yk-employee-entry-card__image {
    background-image:
        linear-gradient(135deg, rgba(23, 51, 92, 0.70), rgba(242, 165, 31, 0.36));
}

.yk-employee-entry-card--voice .yk-employee-entry-card__image {
    background-image:
        linear-gradient(135deg, rgba(23, 51, 92, 0.70), rgba(180, 100, 100, 0.36));
}

/* 文字を読みやすくする暗幕です */
.yk-employee-entry-card__overlay {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.43) 54%, rgba(0, 0, 0, 0.14) 100%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.30), rgba(0, 0, 0, 0.08));
}

/* カード本文です */
.yk-employee-entry-card__body {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 380px;
    padding: 34px 36px;
    color: #ffffff;
    box-sizing: border-box;
}

/* BLOG / VOICE のラベルです */
.yk-employee-entry-card__label {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 32px;
    margin: 0 0 16px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(242, 165, 31, 0.96);
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1;
}

/* タイトルです */
.yk-employee-entry-card__title {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: 31px;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: 0.04em;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.55);
}

/* 説明文です */
.yk-employee-entry-card__text {
    max-width: 440px;
    margin: 0 0 24px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.75;
    letter-spacing: 0.02em;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.55);
}

/* ボタンです */
.yk-employee-entry-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    min-height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.82);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: #17335c;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
    transition: transform 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.yk-employee-entry-card__button::after {
    content: "›";
    margin-left: 12px;
    font-size: 22px;
    line-height: 1;
}

.yk-employee-entry-card__button:hover,
.yk-employee-entry-card__button:focus {
    background: #f39800;
    color: #ffffff;
    transform: translateY(-2px);
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .yk-employee-entry__inner {
        width: min(100% - 56px, 920px);
    }

    .yk-employee-entry__grid {
        gap: 24px;
    }

    .yk-employee-entry-card,
    .yk-employee-entry-card__body {
        min-height: 340px;
    }

    .yk-employee-entry-card__body {
        padding: 30px 28px;
    }

    .yk-employee-entry-card__title {
        font-size: 27px;
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .yk-employee-entry {
        padding: 28px 0 42px;
    }

    .yk-employee-entry__inner {
        width: calc(100% - 32px);
    }

    .yk-employee-entry__grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .yk-employee-entry-card,
    .yk-employee-entry-card__body {
        min-height: 320px;
    }

    .yk-employee-entry-card__body {
        padding: 28px 22px;
    }

    .yk-employee-entry-card__title {
        font-size: 24px;
    }

    .yk-employee-entry-card__text {
        font-size: 15px;
        line-height: 1.7;
    }

    .yk-employee-entry-card__button {
        width: 168px;
        min-height: 42px;
    }
}

/* ============================================================
   従業員の声一覧・詳細
   一覧はA案カード型、詳細は固定4件＋追加お題目を表示します。
   ============================================================ */

.yk-voice-list {
    width: 100%;
    padding: 34px 0 58px;
    background: #efefef;
}

.yk-voice-list__inner {
    width: min(1020px, calc(100% - 72px));
    margin: 0 auto;
}

.yk-voice-list__grid {
    display: grid;
    gap: 28px;
    align-items: stretch;
}

.yk-voice-list__grid--cols-1 {
    grid-template-columns: 1fr;
}

.yk-voice-list__grid--cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.yk-voice-list__grid--cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.yk-voice-list__grid--cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.yk-voice-card {
    height: 100%;
    background: #ffffff;
    border: 1px solid rgba(120, 120, 120, 0.18);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.10);
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.yk-voice-card:hover,
.yk-voice-card:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.14);
}

.yk-voice-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.yk-voice-card__image {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(23, 51, 92, 0.12), rgba(242, 165, 31, 0.20)),
        #d8dee8;
}

.yk-voice-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.yk-voice-card__image-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(23, 51, 92, 0.72);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.yk-voice-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 24px 24px 26px;
}

.yk-voice-card__department {
    width: fit-content;
    min-height: 28px;
    margin: 0 0 12px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #17335c;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.yk-voice-card__title {
    margin: 0 0 8px;
    color: #17335c;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.03em;
}

.yk-voice-card__years {
    margin: 0 0 14px;
    color: #7d3b24;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
}

.yk-voice-card__text {
    flex: 1 1 auto;
    margin: 0 0 22px;
    color: #333333;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0.02em;
}

.yk-voice-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    min-height: 40px;
    margin-top: auto;
    border: 1px solid rgba(160, 80, 70, 0.55);
    border-radius: 999px;
    background: #ffffff;
    color: #9f5a50;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-sizing: border-box;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
}

.yk-voice-card__button::after {
    content: "›";
    margin-left: 10px;
    font-size: 20px;
    line-height: 1;
}

.yk-voice-card:hover .yk-voice-card__button,
.yk-voice-card:focus-within .yk-voice-card__button {
    background: #9f5a50;
    color: #ffffff;
    border-color: #9f5a50;
}

.yk-voice-list__empty {
    margin: 0;
    padding: 38px 20px;
    background: #ffffff;
    border-radius: 12px;
    color: #333333;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}

/* 個別ページの標準タイトルを非表示にします */
body:has(.yk-voice-detail) .entry-title,
body:has(.yk-voice-detail) h1.entry-title,
body:has(.yk-voice-detail) .wp-block-post-title,
body:has(.yk-voice-detail) #main-content > h1:first-child,
body:has(.yk-voice-detail) main > h1:first-child,
body:has(.yk-voice-detail) article > h1:first-child {
    display: none !important;
}

/* 従業員の声詳細です */
.yk-voice-detail {
    width: min(900px, calc(100% - 72px));
    margin: 0 auto 58px;
    padding: 34px 0 0;
}

.yk-voice-detail__hero {
    width: 100%;
    max-width: 760px;
    margin: 0 auto 26px;
    border-radius: 18px;
    overflow: hidden;
    background: #d8dee8;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.10);
}

.yk-voice-detail__hero img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

.yk-voice-detail__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 16 / 9;
    color: rgba(23, 51, 92, 0.72);
    font-size: 32px;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.yk-voice-detail__content {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
}

.yk-voice-detail__profile {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    margin: 0 0 14px;
    padding: 0 14px;
    border-radius: 999px;
    background: #17335c;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

.yk-voice-detail__title {
    margin: 0 0 8px;
    color: #17335c;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.04em;
}

.yk-voice-detail__years {
    margin: 0 0 26px;
    color: #7d3b24;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}

.yk-voice-detail-section {
    margin: 0 0 30px;
}

.yk-voice-detail-section__title {
    margin: 0 0 8px;
    padding-left: 14px;
    border-left: 6px solid #17335c;
    color: #333333;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
}

.yk-voice-detail-section__body {
    padding-left: 20px;
    color: #333333;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.85;
    letter-spacing: 0.02em;
}

.yk-voice-detail-section--extra .yk-voice-detail-section__title {
    border-left-color: #f39800;
}

/* タブレット向けです */
@media screen and (max-width: 1024px) {
    .yk-voice-list__inner {
        width: min(100% - 56px, 920px);
    }

    .yk-voice-list__grid--cols-3,
    .yk-voice-list__grid--cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .yk-voice-detail {
        width: min(100% - 56px, 860px);
    }
}

/* スマートフォン向けです */
@media screen and (max-width: 767px) {
    .yk-voice-list {
        padding: 28px 0 42px;
    }

    .yk-voice-list__inner {
        width: calc(100% - 32px);
    }

    .yk-voice-list__grid,
    .yk-voice-list__grid--cols-2,
    .yk-voice-list__grid--cols-3,
    .yk-voice-list__grid--cols-4 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .yk-voice-card__body {
        padding: 22px 20px 24px;
    }

    .yk-voice-card__title {
        font-size: 21px;
    }

    .yk-voice-card__text {
        font-size: 15px;
        line-height: 1.75;
    }

    .yk-voice-detail {
        width: calc(100% - 32px);
        margin-bottom: 42px;
        padding-top: 28px;
    }

    .yk-voice-detail__hero {
        margin-bottom: 22px;
        border-radius: 14px;
    }

    .yk-voice-detail__title {
        font-size: 28px;
    }

    .yk-voice-detail-section__title {
        font-size: 21px;
    }

    .yk-voice-detail-section__body {
        padding-left: 14px;
        font-size: 16px;
        line-height: 1.8;
    }
}

/* ============================================================
   従業員の声 親ページ配下リスト
   既存の子固定ページをA案カード型で動的表示します。
   ============================================================ */

body:has(.yk-voice-page-list) .entry-title,
body:has(.yk-voice-page-list) h1.entry-title,
body:has(.yk-voice-page-list) .wp-block-post-title,
body:has(.yk-voice-page-list) #main-content > h1:first-child,
body:has(.yk-voice-page-list) main > h1:first-child,
body:has(.yk-voice-page-list) article > h1:first-child {
    display: none !important;
}

body:has(.yk-voice-page-list) #main-content,
body:has(.yk-voice-page-list) .site-main,
body:has(.yk-voice-page-list) .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.yk-voice-page-list {
    width: 100%;
    padding: 34px 0 58px;
    background: #efefef;
}

.yk-voice-page-list__inner {
    width: min(1020px, calc(100% - 72px));
    margin: 0 auto;
}

.yk-voice-page-list__grid {
    display: grid;
    gap: 28px;
    align-items: stretch;
}

.yk-voice-page-list__grid--cols-1 { grid-template-columns: 1fr; }
.yk-voice-page-list__grid--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.yk-voice-page-list__grid--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.yk-voice-page-list__grid--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.yk-voice-page-card {
    height: 100%;
    background: #ffffff;
    border: 1px solid rgba(120, 120, 120, 0.18);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.10);
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.yk-voice-page-card:hover,
.yk-voice-page-card:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.14);
}

.yk-voice-page-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.yk-voice-page-card__image {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(23, 51, 92, 0.12), rgba(242, 165, 31, 0.20)),
        #d8dee8;
}

.yk-voice-page-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.yk-voice-page-card__image-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(23, 51, 92, 0.72);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.yk-voice-page-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 24px 24px 26px;
}

.yk-voice-page-card__title {
    margin: 0 0 14px;
    color: #17335c;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.03em;
}

.yk-voice-page-card__text {
    flex: 1 1 auto;
    margin: 0 0 22px;
    color: #333333;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0.02em;
}

.yk-voice-page-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    min-height: 40px;
    margin-top: auto;
    border: 1px solid rgba(160, 80, 70, 0.55);
    border-radius: 999px;
    background: #ffffff;
    color: #9f5a50;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    box-sizing: border-box;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
}

.yk-voice-page-card__button::after {
    content: "›";
    margin-left: 10px;
    font-size: 20px;
    line-height: 1;
}

.yk-voice-page-card:hover .yk-voice-page-card__button,
.yk-voice-page-card:focus-within .yk-voice-page-card__button {
    background: #9f5a50;
    color: #ffffff;
    border-color: #9f5a50;
}

.yk-voice-page-list__empty {
    margin: 0;
    padding: 38px 20px;
    background: #ffffff;
    border-radius: 12px;
    color: #333333;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}

@media screen and (max-width: 1024px) {
    .yk-voice-page-list__inner {
        width: min(100% - 56px, 920px);
    }

    .yk-voice-page-list__grid--cols-3,
    .yk-voice-page-list__grid--cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 767px) {
    .yk-voice-page-list {
        padding: 28px 0 42px;
    }

    .yk-voice-page-list__inner {
        width: calc(100% - 32px);
    }

    .yk-voice-page-list__grid,
    .yk-voice-page-list__grid--cols-2,
    .yk-voice-page-list__grid--cols-3,
    .yk-voice-page-list__grid--cols-4 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .yk-voice-page-card__body {
        padding: 22px 20px 24px;
    }

    .yk-voice-page-card__title {
        font-size: 21px;
    }

    .yk-voice-page-card__text {
        font-size: 15px;
        line-height: 1.75;
    }
}

/* ============================================================
   従業員の声 親ページ配下リスト 背景幅調整
   グレー背景も上部メニューの内側位置に合わせます。
   ============================================================ */

.yk-voice-page-list {
    width: min(820px, calc(100% - 240px)) !important;
    max-width: 820px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 34px 0 58px !important;
    background: #efefef !important;
    box-sizing: border-box !important;
}

.yk-voice-page-list__inner {
    width: 100% !important;
    max-width: 820px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

.yk-voice-page-list__empty {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* 固定ページ本文側の余白で背景幅が広がらないようにします */
body:has(.yk-voice-page-list) .entry-content {
    width: 100% !important;
}

@media screen and (max-width: 1024px) {
    .yk-voice-page-list {
        width: min(820px, calc(100% - 80px)) !important;
        max-width: 820px !important;
    }

    .yk-voice-page-list__inner {
        width: 100% !important;
        max-width: 820px !important;
    }
}

@media screen and (max-width: 767px) {
    .yk-voice-page-list {
        width: calc(100% - 32px) !important;
        max-width: none !important;
        padding: 28px 0 42px !important;
    }

    .yk-voice-page-list__inner {
        width: 100% !important;
        max-width: none !important;
    }
}

/* ============================================================
   従業員の声 親ページ配下リスト 第1子ページ運用
   第1子ページはカード一覧、第2子ページは通常本文表示にします。
   ============================================================ */

.yk-voice-page-list:empty,
.yk-voice-page-list__inner:empty {
    display: none !important;
}

/* ============================================================
   従業員の声 第2子ページ 定型詳細表示
   [yk_voice_child_page_main] 用です。
   ============================================================ */

/* 詳細ページ側の固定ページ標準見出しを非表示にします */
body:has(.yk-voice-main) .entry-title,
body:has(.yk-voice-main) h1.entry-title,
body:has(.yk-voice-main) .wp-block-post-title,
body:has(.yk-voice-main) #main-content > h1:first-child,
body:has(.yk-voice-main) main > h1:first-child,
body:has(.yk-voice-main) article > h1:first-child {
    display: none !important;
}

body:has(.yk-voice-main) #main-content,
body:has(.yk-voice-main) .site-main,
body:has(.yk-voice-main) .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.yk-voice-main {
    width: min(900px, calc(100% - 72px));
    margin: 0 auto 58px;
    padding: 34px 0 0;
}

.yk-voice-main__header {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: center;
    margin: 0 0 32px;
}

.yk-voice-main__photo {
    width: 220px;
    height: 160px;
    border-radius: 18px;
    overflow: hidden;
    background: #0d4aef;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
}

.yk-voice-main__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.yk-voice-main__photo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: rgba(255, 255, 255, 0.85);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.16em;
}

.yk-voice-main__profile {
    margin: 0 0 10px;
    color: #111111;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.05em;
    text-shadow:
        2px 2px 0 rgba(255, 255, 255, 0.85),
        0 3px 7px rgba(0, 0, 0, 0.28);
}

.yk-voice-main__title {
    margin: 0;
    color: #17335c;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
}

.yk-voice-main__years {
    margin: 8px 0 0;
    color: #7d3b24;
    font-size: 16px;
    font-weight: 700;
}

.yk-voice-main__content {
    width: 100%;
}

.yk-voice-main-section {
    margin: 0 0 30px;
}

.yk-voice-main-section__title {
    margin: 0 0 10px;
    color: #111111;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.03em;
}

.yk-voice-main-section__title::before {
    content: "・";
    margin-right: 6px;
}

.yk-voice-main-section__body {
    padding-left: 32px;
    color: #333333;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.82;
    letter-spacing: 0.02em;
}

.yk-voice-main-section--extra .yk-voice-main-section__title {
    color: #17335c;
}

/* 一覧カード側で基本情報を表示します */
.yk-voice-page-card__profile {
    width: fit-content;
    min-height: 28px;
    margin: 0 0 12px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #17335c;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

@media screen and (max-width: 767px) {
    .yk-voice-main {
        width: calc(100% - 32px);
        margin-bottom: 42px;
        padding-top: 28px;
    }

    .yk-voice-main__header {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .yk-voice-main__photo {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .yk-voice-main__profile {
        font-size: 22px;
    }

    .yk-voice-main-section__title {
        font-size: 22px;
    }

    .yk-voice-main-section__body {
        padding-left: 20px;
        font-size: 16px;
        line-height: 1.8;
    }
}

/* ============================================================
   従業員の声 メニュー表示名調整
   基本情報をメニュー名にした場合の横幅を確保します。
   ============================================================ */

.nav-menu .sub-menu a,
.footer-menu .sub-menu a {
    max-width: none;
}

.nav-menu .sub-menu,
.footer-menu .sub-menu {
    min-width: 260px;
}

/* ============================================================
   従業員の声 詳細ページ タイトル非表示・インデント調整
   管理用タイトル「従業員の声1」は表示せず、本文位置を整えます。
   ============================================================ */

/* 念のためCSS側でも管理用タイトルを非表示にします */
.yk-voice-main__title {
    display: none !important;
}

/* 本文ブロック全体を少し内側へ入れます */
.yk-voice-main__content {
    padding-left: 28px !important;
}

/* お題目の左位置を安定させます */
.yk-voice-main-section {
    margin-left: 0 !important;
}

.yk-voice-main-section__title {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 本文はお題目より少し内側に入れます */
.yk-voice-main-section__body {
    padding-left: 28px !important;
}

/* プロフィール行はタイトル代わりなので、余白を少し整えます */
.yk-voice-main__profile {
    margin-bottom: 0 !important;
}

/* 画像とプロフィール行の高さバランスを調整します */
.yk-voice-main__header {
    margin-bottom: 28px !important;
}

@media screen and (max-width: 767px) {
    .yk-voice-main__content {
        padding-left: 0 !important;
    }

    .yk-voice-main-section__body {
        padding-left: 20px !important;
    }
}

/* ============================================================
   従業員の声 詳細・一覧 最終調整
   ・詳細のお題目は元位置へ戻す
   ・本文だけさらに右へ入れる
   ・一覧の管理用タイトルは非表示
   ・デフォルト画像も通常画像と同じ扱いにする
   ============================================================ */

/* 詳細：全体を右へ動かさない */
.yk-voice-main__content {
    padding-left: 0 !important;
}

/* 詳細：お題目は元位置 */
.yk-voice-main-section,
.yk-voice-main-section__title {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 詳細：本文だけ右へ。前回の移動量を再加算するイメージ */
.yk-voice-main-section__body {
    padding-left: 44px !important;
}

/* 一覧：管理用タイトルは出さない */
.yk-voice-page-card__title {
    display: none !important;
}

/* 一覧：タイトルを消した分、プロフィールと本文の間を調整 */
.yk-voice-page-card__profile {
    margin-bottom: 16px !important;
}

/* 詳細・一覧：デフォルト画像も通常画像と同じ見え方にする */
.yk-voice-page-card__img,
.yk-voice-main__photo-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

@media screen and (max-width: 767px) {
    .yk-voice-main-section__body {
        padding-left: 22px !important;
    }
}

/* ============================================================
   従業員の声 デフォルト画像フィット補強
   アイキャッチ未設定時のデフォルト画像もカード・詳細写真枠に合わせます。
   ============================================================ */

.yk-voice-page-card__image img,
.yk-voice-page-card__img,
.yk-voice-main__photo img,
.yk-voice-main__photo-img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* ============================================================
   従業員の声 カード側デフォルト画像強制反映
   アイキャッチ未設定時の voice-default.jpg をカード画像枠に表示します。
   ============================================================ */

.yk-voice-page-card__image {
    position: relative !important;
    overflow: hidden !important;
    background: #d8dee8 !important;
}

.yk-voice-page-card__image img,
.yk-voice-page-card__image .yk-voice-page-card__img {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    display: block !important;
    object-fit: cover !important;
}

/* 画像が入った場合は VOICE 文字より画像を優先 */
.yk-voice-page-card__image img + span {
    display: none !important;
}

/* ============================================================
   従業員の声 詳細ページ 戻るボタン
   詳細本文の下にカード一覧へ戻るボタンを表示します。
   ============================================================ */

.yk-voice-main__back {
    margin: 42px 0 0;
    text-align: center;
}

.yk-voice-main__back-link {
    min-width: 230px;
    min-height: 46px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(160, 80, 70, 0.62);
    border-radius: 999px;
    background: #ffffff;
    color: #9f5a50 !important;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.06em;
    text-decoration: none !important;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        background-color 0.18s ease,
        color 0.18s ease;
}

.yk-voice-main__back-link::before {
    content: "‹";
    margin-right: 10px;
    font-size: 20px;
    line-height: 1;
}

.yk-voice-main__back-link:hover,
.yk-voice-main__back-link:focus {
    background: #9f5a50;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

@media screen and (max-width: 767px) {
    .yk-voice-main__back {
        margin-top: 32px;
    }

    .yk-voice-main__back-link {
        width: 100%;
        min-width: 0;
    }
}

/* ============================================================
   従業員の日常【ブログ】 入口ページ
   GET方式の年月ドロップダウンで、崩れにくく投稿カードを切り替えます。
   ============================================================ */

body:has(.yk-blog-entry) .entry-title,
body:has(.yk-blog-entry) h1.entry-title,
body:has(.yk-blog-entry) .wp-block-post-title,
body:has(.yk-blog-entry) #main-content > h1:first-child,
body:has(.yk-blog-entry) main > h1:first-child,
body:has(.yk-blog-entry) article > h1:first-child {
    display: none !important;
}

body:has(.yk-blog-entry) #main-content,
body:has(.yk-blog-entry) .site-main,
body:has(.yk-blog-entry) .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.yk-blog-entry {
    width: min(900px, calc(100% - 72px));
    margin: 0 auto 64px 24px;
    padding: 52px 0 0;
}

.yk-blog-entry__title {
    margin: 0 0 26px;
    color: #17335c;
    font-size: clamp(34px, 3.8vw, 48px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.06em;
    text-shadow: 2px 2px 0 rgba(255, 255, 255, 0.85), 0 3px 7px rgba(0, 0, 0, 0.20);
}

.yk-blog-entry__message {
    position: relative;
    width: 100%;
    min-height: 250px;
    margin: 0 0 36px;
    padding: 34px 44px 34px;
    border: 2px solid #17335c;
    background: rgba(255, 255, 255, 0.48);
    box-sizing: border-box;
}

.yk-blog-entry__message-text {
    width: min(620px, calc(100% - 210px));
    color: #222222;
    font-size: clamp(16px, 1.18vw, 19px);
    font-weight: 700;
    line-height: 1.9;
    letter-spacing: 0.04em;
}

.yk-blog-entry__message-text p { margin: 0 0 0.95em; }
.yk-blog-entry__message-text p:last-child { margin-bottom: 0; }

.yk-blog-entry__old-button-wrap {
    position: absolute;
    right: 36px;
    bottom: 28px;
}

.yk-blog-entry__old-button {
    min-width: 176px;
    min-height: 42px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(160, 80, 70, 0.62);
    border-radius: 999px;
    background: #ffffff;
    color: #9f5a50 !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.08em;
    text-decoration: none !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.10);
}

.yk-blog-entry__old-button::after {
    content: "›";
    margin-left: 10px;
    font-size: 20px;
    line-height: 1;
}

.yk-blog-entry__posts { width: 100%; }

.yk-blog-entry__posts-head {
    margin: 0 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.yk-blog-entry__posts-title {
    margin: 0;
    color: #17335c;
    font-size: clamp(27px, 2.7vw, 36px);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.06em;
}

.yk-blog-entry__archive-form {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.yk-blog-entry__archive-label {
    color: #333333;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.yk-blog-entry__archive-select {
    min-width: 170px;
    min-height: 38px;
    padding: 0 34px 0 12px;
    border: 1px solid rgba(23, 51, 92, 0.36);
    border-radius: 8px;
    background: #ffffff;
    color: #222222;
    font-size: 14px;
    font-weight: 700;
}

.yk-blog-entry__archive-submit {
    min-height: 38px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: #17335c;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
}

.yk-blog-entry-post-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.yk-blog-entry-post-card {
    overflow: hidden;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.13);
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.yk-blog-entry-post-card__link {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none !important;
}

.yk-blog-entry-post-card__image {
    aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, rgba(23, 51, 92, 0.70), rgba(242, 165, 31, 0.36)), #d8dee8;
    overflow: hidden;
}

.yk-blog-entry-post-card__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.yk-blog-entry-post-card__image span {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(23, 51, 92, 0.75);
    font-size: 21px;
    font-weight: 700;
    letter-spacing: 0.16em;
}

.yk-blog-entry-post-card__body { padding: 18px 20px 22px; }

.yk-blog-entry-post-card__date {
    display: block;
    margin: 0 0 9px;
    color: #9f5a50;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.yk-blog-entry-post-card__title {
    margin: 0 0 11px;
    color: #17335c;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.04em;
}

.yk-blog-entry-post-card__excerpt {
    margin: 0;
    color: #333333;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.72;
    letter-spacing: 0.02em;
}

.yk-blog-entry__empty {
    padding: 28px 32px;
    border: 1px solid rgba(0, 0, 0, 0.18);
    background: rgba(255, 255, 255, 0.62);
    color: #333333;
    font-size: 16px;
    font-weight: 700;
}

@media screen and (max-width: 1024px) {
    .yk-blog-entry {
        width: min(900px, calc(100% - 56px));
        margin-left: auto;
        margin-right: auto;
    }

    .yk-blog-entry-post-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        width: calc(100% - 32px);
        margin-bottom: 48px;
        padding-top: 34px;
    }

    .yk-blog-entry__title {
        margin-bottom: 18px;
        font-size: 28px;
        line-height: 1.35;
    }

    .yk-blog-entry__message {
        min-height: 0;
        padding: 24px 22px 28px;
    }

    .yk-blog-entry__message-text {
        width: 100%;
        font-size: 16px;
        line-height: 1.85;
        letter-spacing: 0.02em;
    }

    .yk-blog-entry__old-button-wrap {
        position: static;
        margin-top: 24px;
    }

    .yk-blog-entry__old-button {
        width: 100%;
        min-width: 0;
    }

    .yk-blog-entry__posts-head { display: block; }

    .yk-blog-entry__posts-title {
        margin: 0 0 14px;
        font-size: 26px;
    }

    .yk-blog-entry__archive-form {
        width: 100%;
        display: flex;
        align-items: center;
    }

    .yk-blog-entry__archive-select {
        flex: 1;
        min-width: 0;
    }

    .yk-blog-entry-post-list {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .yk-blog-entry-post-card__title { font-size: 20px; }
}

/* ============================================================
   従業員の日常【ブログ】 赤修正反映
   ・ブログ本体幅を少し詰める
   ・「新ブログ」見出しを非表示
   ・投稿リスト位置をメッセージ枠に自然に揃える
   ============================================================ */

.yk-blog-entry {
    width: min(820px, calc(100% - 72px)) !important;
    margin-left: 28px !important;
    margin-right: auto !important;
}

/* 新ブログ見出しは不要 */
.yk-blog-entry__posts-title {
    display: none !important;
}

/* 見出しを消した分、年月選択がある場合だけ右上に寄せます */
.yk-blog-entry__posts-head {
    justify-content: flex-end !important;
    margin-bottom: 18px !important;
}

/* 年月ドロップダウンが無い場合でも余白が空きすぎないようにします */
.yk-blog-entry__posts-head:empty {
    display: none !important;
}

/* 投稿カード・空メッセージをメッセージ枠と同じ幅で扱います */
.yk-blog-entry__posts,
.yk-blog-entry-post-list,
.yk-blog-entry__empty {
    width: 100% !important;
}

/* 投稿がない場合の枠を少し控えめにします */
.yk-blog-entry__empty {
    padding: 22px 28px !important;
}

/* 3列カードが狭くなりすぎないよう、PCでは2列基準にします */
.yk-blog-entry-post-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media screen and (max-width: 1024px) {
    .yk-blog-entry {
        width: min(820px, calc(100% - 56px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        width: calc(100% - 32px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .yk-blog-entry__posts-head {
        justify-content: flex-start !important;
    }

    .yk-blog-entry-post-list {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 左寄り・本文回り込み再調整
   ・ページ全体を中央寄せに戻す
   ・メッセージ本文を旧ブログボタン開始位置で止めず、右側まで使う
   ・ボタン周辺だけ余白を確保して重なりを防ぐ
   ============================================================ */

.yk-blog-entry {
    width: min(820px, calc(100% - 72px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 右側の空白を作らず、文章を枠幅いっぱいに使います */
.yk-blog-entry__message-text {
    width: 100% !important;
    max-width: none !important;
    padding-right: 0 !important;
}

/* 旧ブログボタンと本文が重ならないよう、枠下だけ余白を確保します */
.yk-blog-entry__message {
    padding-bottom: 82px !important;
}

/* ボタン位置は右下のまま維持します */
.yk-blog-entry__old-button-wrap {
    right: 36px !important;
    bottom: 28px !important;
}

@media screen and (max-width: 1024px) {
    .yk-blog-entry {
        width: min(820px, calc(100% - 56px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        width: calc(100% - 32px) !important;
    }

    .yk-blog-entry__message {
        padding-bottom: 28px !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル余白・中央・ハッピー配色調整
   ・メニュー下からタイトルまでの余白を他ページに近づけます
   ・タイトルを中央寄せにします
   ・タイトルを明るく楽しい配色にします
   ============================================================ */

.yk-blog-entry {
    padding-top: 28px !important;
}

.yk-blog-entry__title {
    margin: 0 0 24px !important;
    text-align: center !important;
    color: #f39800 !important;
    font-size: clamp(36px, 3.8vw, 50px) !important;
    letter-spacing: 0.08em !important;
    text-shadow:
        2px 2px 0 #ffffff,
        4px 4px 0 rgba(23, 51, 92, 0.22),
        0 5px 12px rgba(243, 152, 0, 0.22) !important;
}

.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: "＊";
    display: inline-block;
    margin: 0 0.32em;
    color: #17335c;
    font-size: 0.72em;
    vertical-align: 0.08em;
    text-shadow:
        1px 1px 0 #ffffff,
        0 3px 8px rgba(23, 51, 92, 0.18);
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        padding-top: 24px !important;
    }

    .yk-blog-entry__title {
        margin-bottom: 20px !important;
        font-size: 29px !important;
        letter-spacing: 0.04em !important;
    }

    .yk-blog-entry__title::before,
    .yk-blog-entry__title::after {
        margin: 0 0.16em;
        font-size: 0.62em;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル色味・本文最終調整
   余計な記号は付けず、色味だけ明るく整えます。
   ============================================================ */

.yk-blog-entry {
    padding-top: 26px !important;
}

.yk-blog-entry__title {
    margin: 0 0 24px !important;
    text-align: center !important;
    color: #f39800 !important;
    background: linear-gradient(90deg, #f39800 0%, #ffbd3d 42%, #17335c 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    font-size: clamp(36px, 3.8vw, 50px) !important;
    letter-spacing: 0.08em !important;
    text-shadow: none !important;
    filter: drop-shadow(2px 2px 0 rgba(255, 255, 255, 0.92))
            drop-shadow(0 4px 6px rgba(23, 51, 92, 0.18));
}

.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: none !important;
    display: none !important;
}

/* 指定文面が読みやすいよう本文を少し強めにします */
.yk-blog-entry__message-text {
    font-size: clamp(17px, 1.22vw, 20px) !important;
    line-height: 1.92 !important;
    font-weight: 700 !important;
}

/* 旧ブログボタンと本文の重なりを避ける下余白は維持 */
.yk-blog-entry__message {
    padding-bottom: 82px !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        padding-top: 22px !important;
    }

    .yk-blog-entry__title {
        font-size: 29px !important;
        letter-spacing: 0.04em !important;
    }

    .yk-blog-entry__message {
        padding-bottom: 28px !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 赤入れ反映 余白最終調整
   ・メニュー下からタイトルまでの余白を約半分へ
   ・メッセージ枠内の左右余白を少なめに
   ・右側の空きが目立たないよう本文幅を再調整
   ============================================================ */

/* メニュー下の余白を詰めます */
.yk-blog-entry {
    padding-top: 12px !important;
}

/* タイトルは中央のまま、下余白も少しだけ詰めます */
.yk-blog-entry__title {
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    text-align: center !important;
}

/* 枠内の左右余白を少なめにします */
.yk-blog-entry__message {
    padding-top: 30px !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
    padding-bottom: 78px !important;
}

/* 文章はボタン開始位置手前で極端に止めず、枠内を自然に使います */
.yk-blog-entry__message-text {
    width: 100% !important;
    max-width: none !important;
    padding-right: 0 !important;
}

/* 旧ブログボタンは右下維持。右端だけ少し内側へ */
.yk-blog-entry__old-button-wrap {
    right: 30px !important;
    bottom: 24px !important;
}

/* 投稿エリアの上側余白も少し詰めます */
.yk-blog-entry__posts-head {
    margin-top: 0 !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        padding-top: 18px !important;
    }

    .yk-blog-entry__title {
        margin-bottom: 16px !important;
    }

    .yk-blog-entry__message {
        padding: 24px 22px 28px !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル上寄せ・ハッピー調整
   参考イメージのように、メニュー直下へ寄せて淡い明るいタイトルにします。
   ============================================================ */

/* ページ全体の開始位置をさらに上へ */
.yk-blog-entry {
    padding-top: 0 !important;
}

/* タイトルをメニュー直下に近づけ、淡いピンク〜オレンジ系で明るくします */
.yk-blog-entry__title {
    margin-top: -2px !important;
    margin-bottom: 14px !important;
    text-align: center !important;
    color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    font-size: clamp(38px, 4vw, 54px) !important;
    font-weight: 700 !important;
    letter-spacing: 0.10em !important;
    line-height: 1.18 !important;
    text-shadow:
        0 0 1px #8f5574,
        1px 1px 0 #b77b9a,
        2px 2px 0 rgba(255, 255, 255, 0.94),
        0 5px 10px rgba(23, 51, 92, 0.18) !important;
    filter: none !important;
}

/* 余計な装飾は付けず、色味と影だけでハッピー寄りにします */
.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: none !important;
    display: none !important;
}

/* タイトル下から本文枠までの距離も少し詰めます */
.yk-blog-entry__message {
    margin-top: 0 !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry {
        padding-top: 8px !important;
    }

    .yk-blog-entry__title {
        margin-top: 0 !important;
        margin-bottom: 14px !important;
        font-size: 30px !important;
        letter-spacing: 0.05em !important;
        line-height: 1.25 !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル視認性・本文変更対応
   同系色で埋もれないよう、紺フチ＋明るい黄色で目立たせます。
   ============================================================ */

.yk-blog-entry__title {
    color: #ffe45c !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    text-shadow:
        2px 2px 0 #17335c,
        -1px -1px 0 #17335c,
        1px -1px 0 #17335c,
        -1px 1px 0 #17335c,
        0 5px 10px rgba(0, 0, 0, 0.28),
        0 0 14px rgba(255, 228, 92, 0.45) !important;
    filter: none !important;
}

/* 文面変更後、行数が減るので枠内の余白を少し締めます */
.yk-blog-entry__message {
    min-height: 0 !important;
    padding-top: 34px !important;
    padding-bottom: 74px !important;
}

.yk-blog-entry__message-text {
    font-size: clamp(17px, 1.22vw, 20px) !important;
    line-height: 1.96 !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        text-shadow:
            1px 1px 0 #17335c,
            -1px -1px 0 #17335c,
            0 4px 8px rgba(0, 0, 0, 0.22) !important;
    }

    .yk-blog-entry__message {
        padding-bottom: 28px !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル ゴージャス配色
   単色の黄色をやめ、シャンパンゴールド＋ローズ＋紺影で上品に目立たせます。
   ============================================================ */

.yk-blog-entry__title {
    color: transparent !important;
    background:
        linear-gradient(
            90deg,
            #8a5a12 0%,
            #d8a735 16%,
            #fff2a8 31%,
            #f7c85f 45%,
            #c48a2c 58%,
            #e9b7cf 72%,
            #fff3fb 84%,
            #d89aba 100%
        ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-stroke: 0.8px rgba(23, 51, 92, 0.78);
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.96),
        0 2px 0 rgba(255, 255, 255, 0.72),
        2px 3px 0 rgba(23, 51, 92, 0.36),
        0 7px 12px rgba(0, 0, 0, 0.22),
        0 0 18px rgba(255, 215, 126, 0.50) !important;
    filter:
        drop-shadow(0 0 3px rgba(255, 255, 255, 0.88))
        drop-shadow(0 4px 7px rgba(23, 51, 92, 0.22)) !important;
}

/* ゴージャス感を出しつつ、文字周辺は少しだけ明るくします */
.yk-blog-entry__title-wrap,
.yk-blog-entry__title {
    position: relative;
}

@supports (-webkit-background-clip: text) {
    .yk-blog-entry__title {
        text-fill-color: transparent;
        -webkit-text-fill-color: transparent;
    }
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        -webkit-text-stroke: 0.45px rgba(23, 51, 92, 0.78);
        text-shadow:
            0 1px 0 rgba(255, 255, 255, 0.96),
            1px 2px 0 rgba(23, 51, 92, 0.30),
            0 5px 9px rgba(0, 0, 0, 0.18),
            0 0 12px rgba(255, 215, 126, 0.42) !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル ゴールド塗り修正
   白抜き感を消し、文字の中を濃い金〜ブロンズでしっかり塗ります。
   ============================================================ */

.yk-blog-entry__title {
    color: #d9a12d !important;
    background:
        linear-gradient(
            180deg,
            #fff0a8 0%,
            #f7cf61 24%,
            #d79a24 48%,
            #9f6a18 72%,
            #f2c45b 100%
        ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-fill-color: transparent !important;
    -webkit-text-stroke: 0.55px rgba(23, 51, 92, 0.86) !important;
    text-shadow:
        1px 1px 0 rgba(255, 255, 255, 0.72),
        2px 3px 0 rgba(23, 51, 92, 0.34),
        0 6px 10px rgba(0, 0, 0, 0.22),
        0 0 10px rgba(247, 207, 97, 0.40) !important;
    filter: none !important;
}

/* 以前の白っぽい強調が残る場合の打ち消しです */
.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: none !important;
    display: none !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        -webkit-text-stroke: 0.4px rgba(23, 51, 92, 0.86) !important;
        text-shadow:
            1px 1px 0 rgba(255, 255, 255, 0.68),
            1px 2px 0 rgba(23, 51, 92, 0.30),
            0 5px 8px rgba(0, 0, 0, 0.18) !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル ピンク・グリーン系配色
   ヘッダー/フッターの金色と被らないよう、華やかなローズピンク＋ミントグリーンへ変更します。
   ============================================================ */

.yk-blog-entry__title {
    color: #d95f9f !important;
    background:
        linear-gradient(
            90deg,
            #d95f9f 0%,
            #ff9fc8 20%,
            #fff4fb 35%,
            #72d6ba 52%,
            #2fa98f 68%,
            #b7f2df 82%,
            #e46aaa 100%
        ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-fill-color: transparent !important;
    -webkit-text-stroke: 0.65px rgba(23, 51, 92, 0.82) !important;
    text-shadow:
        1px 1px 0 rgba(255, 255, 255, 0.86),
        2px 3px 0 rgba(23, 51, 92, 0.30),
        0 6px 10px rgba(0, 0, 0, 0.18),
        0 0 12px rgba(255, 159, 200, 0.36),
        0 0 14px rgba(114, 214, 186, 0.26) !important;
    filter: none !important;
}

/* 旧指定の余計な装飾を打ち消します */
.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: none !important;
    display: none !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        -webkit-text-stroke: 0.45px rgba(23, 51, 92, 0.82) !important;
        text-shadow:
            1px 1px 0 rgba(255, 255, 255, 0.82),
            1px 2px 0 rgba(23, 51, 92, 0.26),
            0 5px 8px rgba(0, 0, 0, 0.16),
            0 0 10px rgba(255, 159, 200, 0.30) !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル 白抜き感抑制
   白い中間色を減らし、ローズ〜ミントをしっかり塗りつつ立体感は影で残します。
   ============================================================ */

.yk-blog-entry__title {
    color: #d85a9c !important;
    background:
        linear-gradient(
            180deg,
            #ffb1d2 0%,
            #e86ca8 22%,
            #c83f8d 45%,
            #42c9aa 68%,
            #24947f 100%
        ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-fill-color: transparent !important;
    -webkit-text-stroke: 0.65px rgba(23, 51, 92, 0.84) !important;
    text-shadow:
        1px 1px 0 rgba(255, 255, 255, 0.62),
        2px 3px 0 rgba(23, 51, 92, 0.32),
        0 6px 10px rgba(0, 0, 0, 0.18),
        0 0 8px rgba(232, 108, 168, 0.24),
        0 0 10px rgba(66, 201, 170, 0.22) !important;
    filter: none !important;
}

.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: none !important;
    display: none !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        -webkit-text-stroke: 0.45px rgba(23, 51, 92, 0.84) !important;
        text-shadow:
            1px 1px 0 rgba(255, 255, 255, 0.55),
            1px 2px 0 rgba(23, 51, 92, 0.28),
            0 5px 8px rgba(0, 0, 0, 0.16) !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 タイトル グリーンベース＋レッド差し色
   緑を主役にし、赤みは端と影に少しだけ入れて華やかさを出します。
   ============================================================ */

.yk-blog-entry__title {
    color: #2fb58f !important;
    background:
        linear-gradient(
            180deg,
            #d8fff0 0%,
            #7ee6c6 18%,
            #2fc59e 42%,
            #168c77 72%,
            #0f6f62 100%
        ) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-fill-color: transparent !important;
    -webkit-text-stroke: 0.65px rgba(23, 51, 92, 0.84) !important;
    text-shadow:
        1px 1px 0 rgba(255, 255, 255, 0.58),
        2px 3px 0 rgba(23, 51, 92, 0.32),
        0 6px 10px rgba(0, 0, 0, 0.18),
        0 0 9px rgba(47, 197, 158, 0.30),
        0 0 7px rgba(218, 74, 92, 0.18) !important;
    filter: none !important;
}

/* 差し色の赤は強く出しすぎず、下線風の薄いアクセントだけにします */
.yk-blog-entry__title::before,
.yk-blog-entry__title::after {
    content: "";
    display: inline-block !important;
    width: 0.9em;
    height: 0.12em;
    margin: 0 0.28em;
    vertical-align: 0.18em;
    border-radius: 999px;
    background: linear-gradient(90deg, #e95f6f, #ffb2ba);
    box-shadow: 0 2px 5px rgba(23, 51, 92, 0.16);
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__title {
        -webkit-text-stroke: 0.45px rgba(23, 51, 92, 0.84) !important;
        text-shadow:
            1px 1px 0 rgba(255, 255, 255, 0.54),
            1px 2px 0 rgba(23, 51, 92, 0.28),
            0 5px 8px rgba(0, 0, 0, 0.16),
            0 0 7px rgba(47, 197, 158, 0.26) !important;
    }

    .yk-blog-entry__title::before,
    .yk-blog-entry__title::after {
        width: 0.55em;
        margin: 0 0.12em;
    }
}

/* ============================================================
   従業員の日常【ブログ】 メッセージ右寄せ行
   段落内の一部だけを右端へ寄せます。
   ============================================================ */

.yk-blog-entry__line-right {
    display: block;
    width: 100%;
    text-align: right;
}

/* 右寄せ行が窮屈に見えないよう、段落間を少しだけ整えます */
.yk-blog-entry__message-text p {
    margin-bottom: 1.12em !important;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__line-right {
        text-align: left;
    }
}

/* ============================================================
   従業員の日常【ブログ】 右寄せ改行解除・旧ブログボタン浮遊
   右寄せ用spanは使わず、旧ブログボタンに軽いフロートアニメーションを付けます。
   ============================================================ */

/* 右寄せ指定を完全に解除します */
.yk-blog-entry__line-right {
    display: inline !important;
    width: auto !important;
    text-align: inherit !important;
}

/* 旧ブログボタン：常時ふわっと浮く動き */
.yk-blog-entry__old-button {
    position: relative;
    overflow: hidden;
    animation: ykBlogOldButtonFloat 3.2s ease-in-out infinite;
    will-change: transform, box-shadow;
}

/* 旧ブログボタン：光が横切る控えめな演出 */
.yk-blog-entry__old-button::before {
    content: "";
    position: absolute;
    top: -40%;
    left: -70%;
    width: 42%;
    height: 180%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.72) 50%,
        transparent 100%
    );
    transform: rotate(22deg);
    animation: ykBlogOldButtonShine 4.2s ease-in-out infinite;
    pointer-events: none;
}

/* 既存の矢印はそのまま表示 */
.yk-blog-entry__old-button::after {
    position: relative;
    z-index: 1;
}

.yk-blog-entry__old-button:hover,
.yk-blog-entry__old-button:focus {
    animation-play-state: paused;
    transform: translateY(-3px) scale(1.03) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18) !important;
}

@keyframes ykBlogOldButtonFloat {
    0%, 100% {
        transform: translateY(0);
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.10);
    }
    50% {
        transform: translateY(-5px);
        box-shadow: 0 13px 24px rgba(0, 0, 0, 0.16);
    }
}

@keyframes ykBlogOldButtonShine {
    0%, 52% {
        left: -75%;
        opacity: 0;
    }
    58% {
        opacity: 1;
    }
    74% {
        left: 130%;
        opacity: 0;
    }
    100% {
        left: 130%;
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .yk-blog-entry__old-button,
    .yk-blog-entry__old-button::before {
        animation: none !important;
    }
}

/* ============================================================
   従業員の日常【ブログ】 署名・旧ブログボタン同行配置
   PCでは左に「ブログ担当より」、右に旧ブログボタンを配置します。
   スマホでは縦並びへ戻して崩れを防ぎます。
   ============================================================ */

/* absolute配置を解除し、footer行の右側要素として扱います */
.yk-blog-entry__old-button-wrap {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
}

/* メッセージ枠の下余白を通常に戻します */
.yk-blog-entry__message {
    padding-bottom: 30px !important;
}

/* 署名とボタンの同行レイアウト */
.yk-blog-entry__message-footer {
    width: 100%;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.yk-blog-entry__author {
    margin: 0 !important;
    color: #222222;
    font-size: inherit;
    font-weight: 700;
    line-height: 1.7;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

/* ボタンは右側へ固定しつつ、アニメーションは維持 */
.yk-blog-entry__message-footer .yk-blog-entry__old-button {
    flex-shrink: 0;
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__message {
        padding-bottom: 28px !important;
    }

    .yk-blog-entry__message-footer {
        display: block;
        margin-top: 20px;
    }

    .yk-blog-entry__author {
        margin-bottom: 16px !important;
        white-space: normal;
    }

    .yk-blog-entry__message-footer .yk-blog-entry__old-button {
        width: 100%;
    }
}

/* ============================================================
   従業員の日常【ブログ】 旧ブログボタン ドットメッシュ版
   アップロードHTMLの「右へ押し出るアニメーションボタン」を旧ブログボタンへ適用します。
   ============================================================ */

.yk-blog-entry__old-button::before,
.yk-blog-entry__old-button::after {
    content: none !important;
    display: none !important;
}

.yk-blog-entry__old-button {
    width: 250px !important;
    min-width: 250px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    border: 2px solid #1b0704 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    cursor: pointer !important;

    background:
        radial-gradient(rgba(0, 0, 0, 0.16) 20%, transparent 21%),
        linear-gradient(
            to bottom,
            #5a241b 0%,
            #a44f42 16%,
            #8f3d31 50%,
            #672318 84%,
            #2c0a05 100%
        ) !important;
    background-size: 3px 3px, 100% 100% !important;

    box-shadow:
        inset 0 5px 6px rgba(0, 0, 0, 0.36),
        inset 0 -5px 6px rgba(0, 0, 0, 0.54),
        0 5px 12px rgba(0, 0, 0, 0.26) !important;

    color: #ffffff !important;
    font-family: "MS Gothic", "Osaka", "Yu Gothic", monospace !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.82) !important;

    animation: ykBlogOldButtonFloat 3.2s ease-in-out infinite;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease !important;
}

.yk-blog-entry__old-button:hover,
.yk-blog-entry__old-button:focus {
    transform: translateY(-3px) scale(1.03) !important;
    filter: brightness(1.08) saturate(1.08);
    box-shadow:
        inset 0 5px 6px rgba(0, 0, 0, 0.32),
        inset 0 -5px 6px rgba(0, 0, 0, 0.48),
        0 12px 24px rgba(0, 0, 0, 0.22) !important;
}

.yk-blog-entry__old-button-main {
    white-space: nowrap;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.yk-blog-entry__old-button-sub {
    display: inline-flex;
    white-space: nowrap;
    margin-left: 5px;
    position: relative;
    z-index: 1;
}

.yk-blog-entry__old-button-sub span {
    display: inline-block;
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    transform: translateX(-14px);
    animation: ykBlogOldButtonPushRight 6s infinite cubic-bezier(0.25, 1, 0.5, 1);
}

.yk-blog-entry__old-button-sub span:nth-child(1)  { animation-delay: 0.00s; }
.yk-blog-entry__old-button-sub span:nth-child(2)  { animation-delay: 0.05s; }
.yk-blog-entry__old-button-sub span:nth-child(3)  { animation-delay: 0.10s; }
.yk-blog-entry__old-button-sub span:nth-child(4)  { animation-delay: 0.15s; }
.yk-blog-entry__old-button-sub span:nth-child(5)  { animation-delay: 0.20s; }
.yk-blog-entry__old-button-sub span:nth-child(6)  { animation-delay: 0.25s; }
.yk-blog-entry__old-button-sub span:nth-child(7)  { animation-delay: 0.30s; }
.yk-blog-entry__old-button-sub span:nth-child(8)  { animation-delay: 0.35s; }
.yk-blog-entry__old-button-sub span:nth-child(9)  { animation-delay: 0.40s; }
.yk-blog-entry__old-button-sub span:nth-child(10) { animation-delay: 0.45s; }
.yk-blog-entry__old-button-sub span:nth-child(11) { animation-delay: 0.50s; }
.yk-blog-entry__old-button-sub span:nth-child(12) { animation-delay: 0.55s; }
.yk-blog-entry__old-button-sub span:nth-child(13) { animation-delay: 0.60s; }

@keyframes ykBlogOldButtonPushRight {
    0% {
        opacity: 0;
        max-width: 0;
        transform: translateX(-14px);
    }
    15%, 75% {
        opacity: 1;
        max-width: 22px;
        transform: translateX(0);
    }
    85%, 100% {
        opacity: 0;
        max-width: 0;
        transform: translateX(-14px);
    }
}

@media screen and (max-width: 767px) {
    .yk-blog-entry__old-button {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .yk-blog-entry__old-button,
    .yk-blog-entry__old-button-sub span {
        animation: none !important;
    }

    .yk-blog-entry__old-button-sub span {
        opacity: 1;
        max-width: none;
        transform: none;
    }
}


/* ============================================================
   Snow Monkey Forms 共通レイアウト整理版 v20
   求人応募フォーム・お見積依頼フォームの現在CLASS専用です。
   旧カラムブロック用CLASSへの追記補正は入れていません。

   求人応募フォーム：
   ・職種                         inp-job
   ・お名前                       inp-name-row
   ・姓                           inp-sei
   ・名                           inp-mei
   ・電話番号 / メールアドレス    inp-contact-row
   ・電話番号                     inp-tel
   ・メールアドレス               inp-mail
   ・住所                         inp-address
   ・希望                         inp-hope

   お見積依頼フォーム：
   ・会社名 / 担当者名            quote-company-row
   ・会社名                       quote-company
   ・担当者名                     quote-person
   ・Eメール                      quote-email-row / quote-email
   ・電話番号 / FAX / 回答先      quote-contact-row
   ・電話番号                     quote-tel
   ・FAX                          quote-fax
   ・回答先                       quote-reply
   ・お問い合わせ内容             quote-kind-row / quote-kind
   ・詳細                         quote-detail-row / quote-detail
   ============================================================ */

/* フォーム見出しの中央寄せです */
body:has(.smf-form) .entry-content > h1:first-child,
body:has(.smf-form) .entry-content > .wp-block-heading:first-child,
body:has(.smf-form) .wp-block-post-content > h1:first-child,
body:has(.smf-form) .wp-block-post-content > .wp-block-heading:first-child,
body:has(.smf-form) main h1:not(.site-title):not(.site-logo):first-of-type {
    text-align: center !important;
}

/* Snow Monkey Forms 共通の基準値です */
body:has(.smf-form) .smf-form {
    --yk-smf-form-width: 800px;
    --yk-smf-side-space: 72px;
    --yk-smf-short-input-width: 180px;
    --yk-smf-column-gap: 10px;
    --yk-smf-item-gap: 8px;
    --yk-smf-label-top-gap: 10px;
    --yk-smf-label-gap: 0px;
    --yk-smf-textarea-height: 150px;

    width: min(var(--yk-smf-form-width), calc(100% - var(--yk-smf-side-space))) !important;
    max-width: min(var(--yk-smf-form-width), calc(100% - var(--yk-smf-side-space))) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    box-sizing: border-box !important;
}

/* 進捗バーは中央寄せを維持します */
body:has(.smf-form) .smf-progress-tracker {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 項目間の縦余白です */
body:has(.smf-form) .smf-item,
body:has(.smf-form) .wp-block-snow-monkey-forms-item.smf-item {
    margin-top: 0 !important;
    margin-bottom: var(--yk-smf-item-gap) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* 項目名と入力欄の間隔です。
   smf-item__label はインライン表示の場合があるため、block化して上余白を確実に効かせます。 */
body:has(.smf-form) .smf-item__col--label {
    margin-top: 0 !important;
    margin-bottom: var(--yk-smf-label-gap) !important;
    padding-top: var(--yk-smf-label-top-gap) !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .smf-item__label {
    display: block !important;
    margin-top: 0 !important;
    margin-bottom: var(--yk-smf-label-gap) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.45 !important;
}

/* 入力欄側の余白を初期化します */
body:has(.smf-form) .smf-item__controls {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* 入力コントロール外枠です */
body:has(.smf-form) .smf-text-control,
body:has(.smf-form) .smf-textarea-control,
body:has(.smf-form) .smf-select-control,
body:has(.smf-form) .smf-radio-buttons-control,
body:has(.smf-form) .smf-checkboxes-control,
body:has(.smf-form) .smf-placeholder {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* input / textarea / select 本体です */
body:has(.smf-form) .smf-text-control__control,
body:has(.smf-form) .smf-textarea-control__control,
body:has(.smf-form) .smf-select-control__control,
body:has(.smf-form) .smf-placeholder input,
body:has(.smf-form) .smf-placeholder textarea,
body:has(.smf-form) .smf-placeholder select,
body:has(.smf-form) input[type="text"],
body:has(.smf-form) input[type="email"],
body:has(.smf-form) input[type="tel"],
body:has(.smf-form) input[type="url"],
body:has(.smf-form) input[type="number"],
body:has(.smf-form) textarea,
body:has(.smf-form) select {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 40px !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) textarea,
body:has(.smf-form) .smf-textarea-control__control {
    min-height: var(--yk-smf-textarea-height) !important;
}

body:has(.smf-form) .smf-item p,
body:has(.smf-form) .smf-item__controls p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ============================================================
   求人応募フォーム
   ============================================================ */

/* 求人フォーム専用の基準値です */
body:has(.inp-job) .smf-form,
body:has(.inp-name-row) .smf-form,
body:has(.inp-contact-row) .smf-form {
    --yk-smf-short-input-width: 180px;
    --yk-smf-column-gap: 10px;
    --yk-smf-job-width: calc((var(--yk-smf-short-input-width) * 2) + var(--yk-smf-column-gap));
}

/* 職種は、お名前2項目分と同じ幅にします */
body:has(.smf-form) .inp-job {
    width: var(--yk-smf-job-width) !important;
    max-width: var(--yk-smf-job-width) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* 住所・希望はフォーム幅いっぱいにします */
body:has(.smf-form) .inp-address,
body:has(.smf-form) .inp-hope {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* お名前行です */
body:has(.smf-form) .inp-name-row,
body:has(.smf-form) .inp-name-row .smf-item__controls {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-name-row .smf-item__controls > .wp-block-group,
body:has(.smf-form) .inp-name-row .smf-item__controls > .is-layout-flex,
body:has(.smf-form) .inp-name-row .smf-item__controls > .is-layout-constrained,
body:has(.smf-form) .inp-name-row .wp-block-group:has(.inp-sei):has(.inp-mei),
body:has(.smf-form) .inp-name-row .is-layout-flex:has(.inp-sei):has(.inp-mei) {
    display: grid !important;
    grid-template-columns: var(--yk-smf-short-input-width) var(--yk-smf-short-input-width) !important;
    column-gap: var(--yk-smf-column-gap) !important;
    row-gap: 0 !important;
    justify-content: start !important;
    align-items: start !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-name-row .smf-placeholder[data-name="sei"],
body:has(.smf-form) .inp-name-row [data-name="sei"],
body:has(.smf-form) .inp-name-row .smf-placeholder:has(.inp-sei),
body:has(.smf-form) .inp-name-row .wp-block-snow-monkey-forms-control:has(.inp-sei) {
    grid-column: 1 !important;
    width: var(--yk-smf-short-input-width) !important;
    max-width: var(--yk-smf-short-input-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-name-row .smf-placeholder[data-name="mei"],
body:has(.smf-form) .inp-name-row [data-name="mei"],
body:has(.smf-form) .inp-name-row .smf-placeholder:has(.inp-mei),
body:has(.smf-form) .inp-name-row .wp-block-snow-monkey-forms-control:has(.inp-mei) {
    grid-column: 2 !important;
    width: var(--yk-smf-short-input-width) !important;
    max-width: var(--yk-smf-short-input-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-name-row .inp-sei,
body:has(.smf-form) .inp-name-row .inp-mei,
body:has(.smf-form) .inp-name-row input.inp-sei,
body:has(.smf-form) .inp-name-row input.inp-mei,
body:has(.smf-form) .inp-name-row .smf-text-control__control.inp-sei,
body:has(.smf-form) .inp-name-row .smf-text-control__control.inp-mei {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* 電話番号 / メールアドレス行です */
body:has(.smf-form) .inp-contact-row,
body:has(.smf-form) .inp-contact-row .smf-item__controls {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-contact-row .smf-item__controls > .wp-block-group,
body:has(.smf-form) .inp-contact-row .smf-item__controls > .is-layout-flex,
body:has(.smf-form) .inp-contact-row .smf-item__controls > .is-layout-constrained,
body:has(.smf-form) .inp-contact-row .wp-block-group:has(.inp-tel):has(.inp-mail),
body:has(.smf-form) .inp-contact-row .is-layout-flex:has(.inp-tel):has(.inp-mail) {
    display: grid !important;
    grid-template-columns: var(--yk-smf-short-input-width) minmax(0, 1fr) !important;
    column-gap: var(--yk-smf-column-gap) !important;
    row-gap: 0 !important;
    align-items: start !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-contact-row .smf-placeholder[data-name="tel"],
body:has(.smf-form) .inp-contact-row [data-name="tel"],
body:has(.smf-form) .inp-contact-row .smf-placeholder:has(.inp-tel),
body:has(.smf-form) .inp-contact-row .wp-block-snow-monkey-forms-control:has(.inp-tel) {
    grid-column: 1 !important;
    width: var(--yk-smf-short-input-width) !important;
    max-width: var(--yk-smf-short-input-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-contact-row .inp-tel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-contact-row .smf-placeholder[data-name="email"],
body:has(.smf-form) .inp-contact-row [data-name="email"],
body:has(.smf-form) .inp-contact-row .smf-placeholder:has(.inp-mail),
body:has(.smf-form) .inp-contact-row .wp-block-snow-monkey-forms-control:has(.inp-mail) {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .inp-contact-row .inp-mail,
body:has(.smf-form) .inp-contact-row input.inp-mail,
body:has(.smf-form) .inp-contact-row .smf-text-control__control.inp-mail {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* 職種欄は readonly ですが、見た目は通常の入力欄と同じにします */
body:has(.smf-form) .inp-job input[readonly],
body:has(.smf-form) .inp-job .smf-text-control__control[readonly],
body:has(.smf-form) input.yk-recruit-job-locked[readonly] {
    background-color: #ffffff !important;
    border-color: #dddddd !important;
    color: inherit !important;
    opacity: 1 !important;
    cursor: default !important;
    -webkit-text-fill-color: currentColor !important;
}

body:has(.smf-form) .inp-job input[readonly]:focus,
body:has(.smf-form) .inp-job .smf-text-control__control[readonly]:focus,
body:has(.smf-form) input.yk-recruit-job-locked[readonly]:focus {
    background-color: #ffffff !important;
    border-color: #999999 !important;
    outline: auto !important;
}

/* ============================================================
   お見積依頼フォーム v17
   現在のUIクラス専用です。旧カラム用の追記補正は入れません。
   会社名 / 担当者名、電話番号 / FAX / 回答先は、
   Snow Monkey Forms の項目内グループを直接整形します。
   ============================================================ */

/* お見積フォーム専用の基準値です */
body:has(.quote-company-row) .smf-form,
body:has(.quote-contact-row) .smf-form,
body:has(.quote-detail-row) .smf-form {
    --yk-quote-company-width: 330px;
    --yk-quote-person-width: 220px;
    --yk-quote-email-width: 430px;
    --yk-quote-contact-width: 160px;
    --yk-quote-fax-width: 160px;
    --yk-quote-reply-width: 90px;
    --yk-quote-kind-width: 100%;
    --yk-smf-column-gap: 10px;
    --yk-smf-item-gap: 8px;
    --yk-smf-label-top-gap: 10px;
    --yk-smf-label-gap: 0px;
    --yk-smf-textarea-height: 170px;
}

/* 会社名 / 担当者名行です */
body:has(.smf-form) .quote-company-row,
body:has(.smf-form) .quote-company-row .smf-item__controls {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-company-row .smf-item__controls > .wp-block-group,
body:has(.smf-form) .quote-company-row .smf-item__controls > .is-layout-flex,
body:has(.smf-form) .quote-company-row .smf-item__controls > .is-layout-constrained,
body:has(.smf-form) .quote-company-row .wp-block-group:has(.quote-company):has(.quote-person),
body:has(.smf-form) .quote-company-row .is-layout-flex:has(.quote-company):has(.quote-person) {
    display: grid !important;
    grid-template-columns: var(--yk-quote-company-width) var(--yk-quote-person-width) !important;
    column-gap: var(--yk-smf-column-gap) !important;
    row-gap: 0 !important;
    justify-content: start !important;
    align-items: start !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 会社名の外側です */
body:has(.smf-form) .quote-company-row .smf-placeholder[data-name="company"],
body:has(.smf-form) .quote-company-row [data-name="company"],
body:has(.smf-form) .quote-company-row .smf-placeholder:has(.quote-company),
body:has(.smf-form) .quote-company-row .wp-block-snow-monkey-forms-control:has(.quote-company) {
    grid-column: 1 !important;
    width: var(--yk-quote-company-width) !important;
    max-width: var(--yk-quote-company-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 担当者名の外側です */
body:has(.smf-form) .quote-company-row .smf-placeholder[data-name="person"],
body:has(.smf-form) .quote-company-row [data-name="person"],
body:has(.smf-form) .quote-company-row .smf-placeholder:has(.quote-person),
body:has(.smf-form) .quote-company-row .wp-block-snow-monkey-forms-control:has(.quote-person) {
    grid-column: 2 !important;
    width: var(--yk-quote-person-width) !important;
    max-width: var(--yk-quote-person-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 会社名 / 担当者名の入力欄本体です */
body:has(.smf-form) .quote-company-row .quote-company,
body:has(.smf-form) .quote-company-row .quote-person,
body:has(.smf-form) .quote-company-row input.quote-company,
body:has(.smf-form) .quote-company-row input.quote-person,
body:has(.smf-form) .quote-company-row .smf-text-control__control.quote-company,
body:has(.smf-form) .quote-company-row .smf-text-control__control.quote-person {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Eメール行です。電話番号 + FAX + 回答先 + 余白の幅にします */
body:has(.smf-form) .quote-email-row,
body:has(.smf-form) .quote-email-row .smf-item__controls,
body:has(.smf-form) .quote-email-row .smf-placeholder:has(.quote-email),
body:has(.smf-form) .quote-email-row .wp-block-snow-monkey-forms-control:has(.quote-email) {
    width: var(--yk-quote-email-width) !important;
    max-width: var(--yk-quote-email-width) !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-email-row .quote-email,
body:has(.smf-form) .quote-email-row input.quote-email,
body:has(.smf-form) .quote-email-row .smf-text-control__control.quote-email {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* 電話番号 / FAX / 回答先行です */
body:has(.smf-form) .quote-contact-row,
body:has(.smf-form) .quote-contact-row .smf-item__controls {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-contact-row .smf-item__controls > .wp-block-group,
body:has(.smf-form) .quote-contact-row .smf-item__controls > .is-layout-flex,
body:has(.smf-form) .quote-contact-row .smf-item__controls > .is-layout-constrained,
body:has(.smf-form) .quote-contact-row .wp-block-group:has(.quote-tel):has(.quote-fax),
body:has(.smf-form) .quote-contact-row .is-layout-flex:has(.quote-tel):has(.quote-fax) {
    display: grid !important;
    grid-template-columns: var(--yk-quote-contact-width) var(--yk-quote-fax-width) var(--yk-quote-reply-width) !important;
    column-gap: var(--yk-smf-column-gap) !important;
    row-gap: 0 !important;
    align-items: start !important;
    justify-content: start !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 電話番号の外側です */
body:has(.smf-form) .quote-contact-row .smf-placeholder[data-name="tel"],
body:has(.smf-form) .quote-contact-row [data-name="tel"],
body:has(.smf-form) .quote-contact-row .smf-placeholder:has(.quote-tel),
body:has(.smf-form) .quote-contact-row .wp-block-snow-monkey-forms-control:has(.quote-tel) {
    grid-column: 1 !important;
    width: var(--yk-quote-contact-width) !important;
    max-width: var(--yk-quote-contact-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* FAXの外側です */
body:has(.smf-form) .quote-contact-row .smf-placeholder[data-name="fax"],
body:has(.smf-form) .quote-contact-row [data-name="fax"],
body:has(.smf-form) .quote-contact-row .smf-placeholder:has(.quote-fax),
body:has(.smf-form) .quote-contact-row .wp-block-snow-monkey-forms-control:has(.quote-fax) {
    grid-column: 2 !important;
    width: var(--yk-quote-fax-width) !important;
    max-width: var(--yk-quote-fax-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 回答先の外側です */
body:has(.smf-form) .quote-contact-row .smf-placeholder[data-name="reply"],
body:has(.smf-form) .quote-contact-row [data-name="reply"],
body:has(.smf-form) .quote-contact-row .smf-placeholder:has(.quote-reply),
body:has(.smf-form) .quote-contact-row .wp-block-snow-monkey-forms-control:has(.quote-reply) {
    grid-column: 3 !important;
    width: var(--yk-quote-reply-width) !important;
    max-width: var(--yk-quote-reply-width) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-contact-row .quote-tel,
body:has(.smf-form) .quote-contact-row .quote-fax,
body:has(.smf-form) .quote-contact-row .quote-reply,
body:has(.smf-form) .quote-contact-row input.quote-tel,
body:has(.smf-form) .quote-contact-row input.quote-fax,
body:has(.smf-form) .quote-contact-row select.quote-reply,
body:has(.smf-form) .quote-contact-row .smf-text-control__control.quote-tel,
body:has(.smf-form) .quote-contact-row .smf-text-control__control.quote-fax,
body:has(.smf-form) .quote-contact-row .smf-select-control__control.quote-reply {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* お問い合わせ内容の選択行です。デフォルト扱いとして全幅にします */
body:has(.smf-form) .quote-kind-row,
body:has(.smf-form) .quote-kind-row .smf-item__controls,
body:has(.smf-form) .quote-kind-row .smf-placeholder:has(.quote-kind),
body:has(.smf-form) .quote-kind-row .wp-block-snow-monkey-forms-control:has(.quote-kind) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-kind-row .quote-kind,
body:has(.smf-form) .quote-kind-row select.quote-kind,
body:has(.smf-form) .quote-kind-row .smf-select-control__control.quote-kind {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* 詳細入力行です */
body:has(.smf-form) .quote-detail-row,
body:has(.smf-form) .quote-detail-row .smf-item__controls,
body:has(.smf-form) .quote-detail-row .smf-placeholder:has(.quote-detail),
body:has(.smf-form) .quote-detail-row .wp-block-snow-monkey-forms-control:has(.quote-detail) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

body:has(.smf-form) .quote-detail-row .quote-detail,
body:has(.smf-form) .quote-detail-row textarea.quote-detail,
body:has(.smf-form) .quote-detail-row .smf-textarea-control__control.quote-detail {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: var(--yk-smf-textarea-height) !important;
    box-sizing: border-box !important;
}

/* ============================================================
   Snow Monkey Forms 送信ボタン
   求人応募フォーム・お見積依頼フォーム共通です。
   ============================================================ */
body:has(.smf-form) .smf-action,
body:has(.smf-form) .smf-action--input,
body:has(.smf-form) .smf-button-control {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.9em 0 0 !important;
    text-align: center !important;
}

body:has(.smf-form) .smf-action button:not(.adminbar-input),
body:has(.smf-form) .smf-action input[type="submit"]:not(.adminbar-input),
body:has(.smf-form) .smf-button-control__control:not(.adminbar-input),
body:has(.smf-form) button[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *),
body:has(.smf-form) input[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 354px !important;
    min-width: 354px !important;
    min-height: 42px !important;
    padding: 10px 30px !important;
    background: linear-gradient(to right, #00bfff 0%, #7fffd4 45%, #fffacd 100%) !important;
    background-size: 200% auto !important;
    color: #191970 !important;
    border: solid 2px #191970 !important;
    border-radius: 20px !important;
    font-size: 1em !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.08em !important;
    text-decoration: none !important;
    box-shadow: 0 5px 0 #191970 !important;
    cursor: pointer !important;
    text-align: center !important;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background-position 0.5s ease,
        color 0.3s ease !important;
}

body:has(.smf-form) .smf-action button:not(.adminbar-input):hover,
body:has(.smf-form) .smf-action input[type="submit"]:not(.adminbar-input):hover,
body:has(.smf-form) .smf-button-control__control:not(.adminbar-input):hover,
body:has(.smf-form) button[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):hover,
body:has(.smf-form) input[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):hover {
    color: #191970 !important;
    background-position: right center !important;
    transform: translateY(5px) !important;
    box-shadow: 0 0 0 #191970 !important;
}

body:has(.smf-form) .smf-action button:not(.adminbar-input):focus,
body:has(.smf-form) .smf-action input[type="submit"]:not(.adminbar-input):focus,
body:has(.smf-form) .smf-button-control__control:not(.adminbar-input):focus,
body:has(.smf-form) button[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):focus,
body:has(.smf-form) input[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):focus {
    outline: 2px solid rgba(25, 25, 112, 0.35) !important;
    outline-offset: 3px !important;
}

body:has(.smf-form) .smf-action button:not(.adminbar-input):active,
body:has(.smf-form) .smf-action input[type="submit"]:not(.adminbar-input):active,
body:has(.smf-form) .smf-button-control__control:not(.adminbar-input):active,
body:has(.smf-form) button[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):active,
body:has(.smf-form) input[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *):active {
    transform: translateY(5px) !important;
    box-shadow: 0 0 0 #191970 !important;
}

/* スマートフォンでは縦並びに戻します */
@media screen and (max-width: 767px) {
    body:has(.smf-form) .smf-form {
        --yk-smf-side-space: 32px;
        --yk-smf-short-input-width: 100%;
        --yk-smf-column-gap: 0px;
        --yk-smf-item-gap: 10px;
        --yk-smf-label-top-gap: 8px;
        --yk-smf-label-gap: 2px;
        --yk-quote-half-width: 100%;
        --yk-quote-email-width: 100%;
        --yk-quote-contact-width: 100%;
        --yk-quote-reply-width: 100%;
        --yk-quote-kind-width: 100%;

        width: calc(100% - var(--yk-smf-side-space)) !important;
        max-width: calc(100% - var(--yk-smf-side-space)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        transform: none !important;
    }

    body:has(.smf-form) .inp-job,
    body:has(.smf-form) .inp-address,
    body:has(.smf-form) .inp-hope,
    body:has(.smf-form) .quote-email-row,
    body:has(.smf-form) .quote-kind-row,
    body:has(.smf-form) .quote-detail-row {
        width: 100% !important;
        max-width: 100% !important;
    }

    body:has(.smf-form) .inp-name-row .smf-item__controls,
    body:has(.smf-form) .inp-name-row .smf-item__controls > .wp-block-group,
    body:has(.smf-form) .inp-contact-row .smf-item__controls > .wp-block-group,
    body:has(.smf-form) .inp-contact-row .smf-item__controls > .is-layout-flex,
    body:has(.smf-form) .inp-contact-row .smf-item__controls > .is-layout-constrained,
    body:has(.smf-form) .inp-contact-row .wp-block-group:has(.inp-tel):has(.inp-mail),
    body:has(.smf-form) .inp-contact-row .is-layout-flex:has(.inp-tel):has(.inp-mail),
    body:has(.smf-form) .quote-company-row .smf-item__controls > .wp-block-group,
    body:has(.smf-form) .quote-company-row .smf-item__controls > .is-layout-flex,
    body:has(.smf-form) .quote-contact-row .smf-item__controls > .wp-block-group,
    body:has(.smf-form) .quote-contact-row .smf-item__controls > .is-layout-flex,
    body:has(.smf-form) .quote-contact-row .smf-item__controls > .is-layout-constrained {
        display: grid !important;
        grid-template-columns: 1fr !important;
        row-gap: 8px !important;
        column-gap: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body:has(.smf-form) .inp-name-row .smf-placeholder,
    body:has(.smf-form) .inp-contact-row .smf-placeholder,
    body:has(.smf-form) .quote-company-row .smf-placeholder,
    body:has(.smf-form) .quote-contact-row .smf-placeholder,
    body:has(.smf-form) .smf-placeholder:has(.inp-sei),
    body:has(.smf-form) .smf-placeholder:has(.inp-mei),
    body:has(.smf-form) .smf-placeholder:has(.inp-tel),
    body:has(.smf-form) .smf-placeholder:has(.inp-mail),
    body:has(.smf-form) .smf-placeholder:has(.quote-company),
    body:has(.smf-form) .smf-placeholder:has(.quote-person),
    body:has(.smf-form) .smf-placeholder:has(.quote-tel),
    body:has(.smf-form) .smf-placeholder:has(.quote-fax),
    body:has(.smf-form) .smf-placeholder:has(.quote-reply) {
        grid-column: auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body:has(.smf-form) .smf-action button:not(.adminbar-input),
    body:has(.smf-form) .smf-action input[type="submit"]:not(.adminbar-input),
    body:has(.smf-form) .smf-button-control__control:not(.adminbar-input),
    body:has(.smf-form) button[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *),
    body:has(.smf-form) input[type="submit"]:not(.adminbar-input):not(#adminbar-search input):not(#wpadminbar *) {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ============================================================
   WordPress管理バー 意図しないデザイン適用のリセット
   ============================================================ */
#wpadminbar .adminbar-input,
#wpadminbar input.adminbar-input,
#wpadminbar #adminbar-search input,
#wpadminbar #adminbar-search input[type="submit"],
#wpadminbar button[type="submit"] {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    transform: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    font-size: inherit !important;
    letter-spacing: normal !important;
}


/* ============================================================
   業務内容 YouTube ホバー再生・レジューム版
   ローカル動画からYouTube埋め込みへ差し替えるための表示調整です。
   ============================================================ */

.yk-youtube-hover {
    width: 80% !important;
    max-width: 800px !important;
    margin: 34px auto 42px !important;
    box-sizing: border-box !important;
}

.yk-youtube-hover--wide {
    width: 86% !important;
    max-width: 860px !important;
}

.yk-youtube-hover__title {
    margin: 0 0 14px !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

.yk-youtube-hover__frame {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border: 3px solid #003f70 !important;
    background: #000000 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.yk-youtube-hover__player,
.yk-youtube-hover__frame iframe {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
}

.yk-youtube-hover__frame::after {
    content: "カーソルを合わせると続きから再生します";
    position: absolute;
    left: 14px;
    bottom: 12px;
    z-index: 2;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.62);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    pointer-events: none;
    opacity: 0.92;
    transition: opacity 0.18s ease;
}

.yk-youtube-hover.is-ended .yk-youtube-hover__frame::after {
    content: "カーソルを合わせると最初から再生します";
}

.yk-youtube-hover.is-playing .yk-youtube-hover__frame::after,
.yk-youtube-hover:hover .yk-youtube-hover__frame::after,
.yk-youtube-hover:focus-within .yk-youtube-hover__frame::after {
    opacity: 0;
}

@media screen and (max-width: 767px) {
    .yk-youtube-hover,
    .yk-youtube-hover--wide {
        width: 100% !important;
        max-width: 100% !important;
        margin: 28px auto 36px !important;
    }

    .yk-youtube-hover__title {
        font-size: 18px !important;
        text-align: left !important;
    }

    .yk-youtube-hover__frame::after {
        content: "タップで再生・一時停止します";
        left: 10px;
        bottom: 10px;
        font-size: 12px;
    }
}

/* ============================================================
   従業員の声 メニュー表示名 整列版 v5
   第2メニューは伸ばさず、従業員の声一覧が入る第3メニューだけを整列表示します。
   ============================================================ */

/* 従業員の声の各人物メニュー行だけ、場所・部門・役職を固定カラムにします */
.nav-menu .sub-menu a .yk-voice-menu-title,
.footer-menu .sub-menu a .yk-voice-menu-title {
    display: grid !important;
    grid-template-columns: 8em 8em 4em !important;
    column-gap: 0.75em !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.nav-menu .sub-menu a .yk-voice-menu-title__place,
.nav-menu .sub-menu a .yk-voice-menu-title__department,
.nav-menu .sub-menu a .yk-voice-menu-title__position,
.footer-menu .sub-menu a .yk-voice-menu-title__place,
.footer-menu .sub-menu a .yk-voice-menu-title__department,
.footer-menu .sub-menu a .yk-voice-menu-title__position {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    text-align: left !important;
    box-sizing: border-box !important;
}

/* 従業員の声の各人物リンクだけ横幅いっぱいにします */
.nav-menu .sub-menu a:has(> .yk-voice-menu-title),
.footer-menu .sub-menu a:has(> .yk-voice-menu-title) {
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box !important;
}

.nav-menu .sub-menu li:has(> a > .yk-voice-menu-title),
.footer-menu .sub-menu li:has(> a > .yk-voice-menu-title) {
    width: 100% !important;
}

/* 重要：第2メニュー全体は伸ばさず、人物リンクを直接含む第3メニューだけを広げます */
.nav-menu .sub-menu:has(> li > a > .yk-voice-menu-title),
.footer-menu .sub-menu:has(> li > a > .yk-voice-menu-title) {
    min-width: 370px !important;
}

/* 第2メニュー側は従来幅のままに戻します */
.nav-menu .sub-menu:not(:has(> li > a > .yk-voice-menu-title)),
.footer-menu .sub-menu:not(:has(> li > a > .yk-voice-menu-title)) {
    min-width: 260px !important;
}

@media screen and (max-width: 767px) {
    .nav-menu .sub-menu:has(> li > a > .yk-voice-menu-title),
    .footer-menu .sub-menu:has(> li > a > .yk-voice-menu-title),
    .nav-menu .sub-menu:not(:has(> li > a > .yk-voice-menu-title)),
    .footer-menu .sub-menu:not(:has(> li > a > .yk-voice-menu-title)) {
        min-width: 0 !important;
        width: 100% !important;
    }

    .nav-menu .sub-menu a .yk-voice-menu-title,
    .footer-menu .sub-menu a .yk-voice-menu-title {
        grid-template-columns: 1fr !important;
        row-gap: 0.2em !important;
        column-gap: 0 !important;
        white-space: normal !important;
    }
}


/* =========================================================
   Snow Monkey Forms：チェックボックス補正 丸替え版
   チェックボックスを通常サイズに戻し、文言を横並びにする
========================================================= */

/* チェックボックス本体 */
.smf-form input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;

  margin: 0 8px 0 0 !important;
  padding: 0 !important;

  display: inline-block !important;
  vertical-align: middle !important;

  line-height: normal !important;
  box-sizing: border-box !important;

  appearance: checkbox !important;
  -webkit-appearance: checkbox !important;
}

/* チェックボックス項目全体 */
.smf-form .smf-checkboxes-control {
  width: 100% !important;
  max-width: 100% !important;
  margin: 12px 0 0 0 !important;
  padding: 0 !important;
}

/* チェックボックスの内側ラッパー */
.smf-form .smf-checkboxes-control__control {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* チェックボックス1項目 */
.smf-form .smf-checkbox-control {
  width: 100% !important;
  max-width: 100% !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: 1.8 !important;
  text-align: left !important;
}

/* チェックボックス本体側の領域 */
.smf-form .smf-checkbox-control__control {
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;

  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;

  margin: 0 8px 0 0 !important;
  padding: 0 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 16px !important;
}

/* チェックボックス文言 */
.smf-form .smf-checkbox-control__label {
  width: auto !important;
  max-width: calc(100% - 24px) !important;

  display: inline-block !important;
  flex: 1 1 auto !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: 1.8 !important;
  text-align: left !important;

  white-space: normal !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;

  writing-mode: horizontal-tb !important;
}

/* labelタグ構造の場合にも対応 */
.smf-form label:has(input[type="checkbox"]) {
  width: 100% !important;
  max-width: 100% !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  gap: 8px !important;

  line-height: 1.8 !important;
  text-align: left !important;

  white-space: normal !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;

  writing-mode: horizontal-tb !important;
}

/* 個人情報説明文内のリンク */
.smf-form a[href*="privacy"] {
  color: #0066cc !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.smf-form a[href*="privacy"]:hover {
  opacity: 0.75;
}