/* リセットCSS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 基本設定 */
:root {
    --primary-color: #3498DB;
    --primary-dark: #2980B9;
    --secondary-color: #E74C3C;
    --accent-color: #FF0000;
    --text-color: #333333;
    --text-light: #666666;
    --gray-light: #F5F5F5;
    --gray-medium: #E0E0E0;
    --gray-dark: #999999;
    --white: #FFFFFF;
    --black: #000000;
    --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    --shadow-hover: 0 4px 20px rgba(0, 0, 0, 0.15);
    --shadow-strong: 0 10px 30px rgba(0, 0, 0, 0.2);
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.6;
    color: var(--text-color);
    background-color: var(--white);
    overflow-x: hidden;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 固定ヘッダー */
.fixed-header {
    position: fixed;
    top: 0; /* 画面最上部に配置 */
    left: 0;
    right: 0;
    height: 7vw;
    background-color: var(--white);
    color: var(--text-color);
    z-index: 1000;
    box-shadow: 0 0.14vw 0.70vw rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

/* オペレーターステータスバー */
.operator-status-bar {
    position: fixed;
    top: 7.0vw; /* ヘッダーの高さ分下に配置 */
    left: 0;
    right: 0;
    background: linear-gradient(135deg, #2E86DE 0%, #3498DB 100%);
    color: var(--white);
    text-align: center;
    padding: 0.70vw;
    font-size: 0.95vw;
    font-weight: 700;
    z-index: 999; /* ヘッダーより下 */
    box-shadow: 0 0.14vw 0.70vw rgba(0, 0, 0, 0.15);
    letter-spacing: 0.05vw;
    transition: top 0.3s ease; /* スムーズな移動アニメーション */
}

/* 時刻フェードアニメーション */
@keyframes color-fade {
    0% {
        color: #FFD700; /* 黄色 */
    }
    33% {
        color: #f9b0f9; /* ピンク */
    }
    66% {
        color: #50e992; /* 明るい緑 */
    }
    100% {
        color: #FFD700; /* 黄色に戻る */
    }
}

.time-hover {
    display: inline-block;
    animation: color-fade 6s ease-in-out infinite;
    font-weight: 700;
}

.header-container {
    margin: 0 auto;
    padding: 0 1.40vw;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    height: 100%;
}

.logo-area {
    display: flex;
    align-items: center;
}

.logo-area img {
    height: 5vw;
    width: auto;
    display: block;
}

.header-cta {
    display: flex;
    align-items: stretch;
    height: 100%;
}

.header-phone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 0.3vw;
    background-color: var(--primary-color);
    color: var(--white);
    padding: 0.8vw 2.10vw;
    border-radius: 0;
    text-decoration: none;
    font-weight: 700;
    /* box-shadow: var(--shadow-strong); */
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.header-phone::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.header-phone:hover::before {
    width: 20.98vw;
    height: 20.98vw;
}

.header-phone:hover {
    transform: translateY(-0.21vw);
    box-shadow: 0 1.05vw 2.80vw rgba(255, 69, 0, 0.3);
}

/* ヘッダー電話ボタン上部（アイコン+テキスト横並び） */
.header-phone-top {
    display: flex;
    align-items: center;
    gap: 0.7vw;
    position: relative;
    z-index: 1;
}

/* ヘッダー電話ボタン専用のサイズ */
.header-phone .cta-icon {
    width: 2.5vw;
    height: auto;
}

.header-phone .cta-small {
    font-size: 1.0vw;
    line-height: 1.2;
    text-align: center;
}

.header-phone .cta-large {
    font-size: 2.3vw;
    position: relative;
    z-index: 1;
}

/* 水道修理業者の画像 - PC版 */
@media (min-width: 769px) {
    .hero-plumber-mobile {
        display: block;
        position: absolute;
        bottom: -9.79vw;
        right: 0;
        width: 62.94vw;
        height: 76.92vw;
        z-index: 2;
    }
}

.hero-plumber-mobile img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: bottom;
}

/* 緊急割引バナー */
.emergency-discount-banner {
    position: fixed;
    top: 5.80vw;
    left: 0;
    right: 0;
    background: linear-gradient(90deg, #87CEEB 0%, #FFFFFF 25%, #87CEEB 50%, #FFFFFF 75%, #87CEEB 100%);
    padding: 0.70vw 0;
    z-index: 999;
    box-shadow: 0 0.14vw 0.70vw rgba(0, 0, 0, 0.2);
    animation: slide 20s linear infinite;
    transition: top 0.3s ease;
}

@keyframes slide {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

.discount-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.05vw;
    font-weight: 700;
    color: #333;
}

.discount-icon {
    font-size: 1.40vw;
    animation: blink 1s infinite;
}

@keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0.3; }
}

.discount-highlight {
    font-size: 1.26vw;
    color: var(--accent-color);
    font-weight: 900;
}

.discount-timer {
    font-size: 0.98vw;
    background-color: rgba(0, 0, 0, 0.8);
    color: var(--white);
    padding: 0.28vw 0.84vw;
    border-radius: 1.40vw;
}

/* ヒーローセクション */
.hero-section {
    margin-top: 8.6vw; /* ヘッダー(約6.5vw) + ステータスバー(2.1vw) */
    position: relative;
    background: linear-gradient(135deg, #87CEEB 0%, #6BB6FF 50%, #4A90E2 100%);
    padding: 2.80vw 0 5.59vw;
    overflow: hidden;
    min-height: 48.95vw;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    z-index: 0;
}

.hero-background::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg,
        rgba(52, 152, 219, 0.1) 0%,
        rgba(255, 255, 255, 0.5) 50%,
        rgba(231, 76, 60, 0.1) 100%);
    z-index: 2;
}

.hero-bg-mobile {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
}

.hero-bg-mobile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    /* opacity: 1; */
    mix-blend-mode: multiply;
}


/* サービスバッジ */

.service-badges {
    position: relative;
    display: flex;
    gap: 1.05vw;
    z-index: 10;
}

.service-badge {
    width: 5.59vw;
    height: 5.59vw;
    background: linear-gradient(135deg, #FFFFFF 0%, #87CEEB 50%, #E0F6FF 100%);
    border: 0.14vw solid #87CEEB;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.35vw;
    box-shadow: 0 0.28vw 0.70vw rgba(135, 206, 235, 0.3);
    transition: all 0.3s ease;
}

.service-badge:hover {
    transform: translateY(-0.35vw);
    box-shadow: 0 0.56vw 1.40vw rgba(135, 206, 235, 0.5);
    background: linear-gradient(135deg, #87CEEB 0%, #5DADE2 100%);
    border-color: #5DADE2;
}

.service-badge:hover .badge-icon,
.service-badge:hover .badge-text {
    color: var(--white);
}

.badge-text {
    font-size: 1.12vw;
    font-weight: 900;
    color: var(--white);
    text-align: center;
    line-height: 1.2;
    text-shadow: 0 0.07vw 0.14vw rgba(0, 0, 0, 0.2);
}

.hero-content {
    position: relative;
    z-index: 3;
    text-align: left;
    max-width: 83.92vw;
    margin: 0 auto;
    padding: 0 1.40vw 0 6.99vw;
    width: 100%;
}

.hero-diagonal-rectangle {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 25%;
    height: 6.99vw;
    background: var(--primary-color);
    z-index: 4;
    clip-path: polygon(0 30%, 100% 0, 100% 100%, 0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.diagonal-text {
    display: flex;
    align-items: flex-end;
    gap: 0.56vw;
    padding-top: 1.40vw;
    font-weight: 700;
    font-style: italic;
    position: relative;
    top: -0.28vw;
}

.area-text {
    font-size: 1.96vw;
    color: var(--white);
}

.ha-text {
    font-size: 1.26vw;
    color: var(--white);
    position: relative;
    top: -0.28vw;
}

.speed-text {
    font-size: 2.38vw;
    color: #FFEB3B;
    font-weight: 900;
    text-shadow:
        0.07vw 0.07vw 0.14vw rgba(0, 0, 0, 0.4),
        0 0 0.07vw rgba(0, 0, 0, 0.5);
    position: relative;
    top: 0.35vw;
}

.hero-emergency {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin-bottom: 1.40vw;
    margin-top: 0;
}

.emergency-badge {
    background-color: var(--accent-color);
    color: var(--white);
    padding: 0.42vw 1.40vw;
    border-radius: 2.10vw;
    font-weight: 700;
    font-size: 1.47vw;
    animation: pulse 2s infinite;
    border: 0.14vw solid var(--white);
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.emergency-time {
    font-size: 1.68vw;
    font-weight: 700;
    color: var(--primary-color);
}

.speech-bubble {
    position: relative;
    background: var(--white);
    border: 0.21vw solid var(--primary-color);
    border-radius: 0;
    padding: 0.70vw 2.45vw 1.26vw 2.45vw;
    display: inline-block;
    box-shadow: 0 0.28vw 0.70vw rgba(0, 0, 0, 0.1);
    transform: skewX(-10deg);
}

.speech-bubble > * {
    transform: skewX(10deg);
}

.speech-bubble::after {
    content: '';
    position: absolute;
    bottom: -1.05vw;
    left: 3.50vw;
    width: 0;
    height: 0;
    border-left: 1.05vw solid transparent;
    border-right: 1.05vw solid transparent;
    border-top: 1.05vw solid var(--primary-color);
    transform: skewX(10deg);
}

/* .speech-bubble::before {
    content: '';
    position: absolute;
    bottom: -11px;
    left: 52px;
    width: 0;
    height: 0;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-top: 13px solid var(--white);
    z-index: 1;
    transform: skewX(10deg);
} */

.highlight-time {
    font-size: 1.3em;
    color: #FFD700;
    font-weight: 900;
    text-shadow: 0 0 0.70vw rgba(255, 255, 255, 0.8),
                 0 0 1.40vw rgba(255, 255, 255, 0.6),
                 0 0 2.10vw rgba(255, 255, 255, 0.4);
}

.hero-title {
    margin-bottom: 2.10vw;
}

.title-small {
    display: block;
    font-size: 2.52vw;
    font-weight: 500;
    color: var(--text-color);
    margin-bottom: 0.70vw;
}

.title-large {
    display: block;
    font-size: 5.03vw;
    font-weight: 900;
    color: var(--primary-color);
    line-height: 1.2;
    text-shadow: 0.14vw 0.14vw 0.28vw rgba(0, 0, 0, 0.1);
}

.super-text {
    font-size: 7.69vw;
    color: #FFEB3B;
    font-style: italic;
    font-weight: 900;
    text-shadow:
        0.14vw 0.14vw 0.28vw rgba(0, 0, 0, 0.4),
        0 0 0.07vw rgba(0, 0, 0, 0.5);
    margin-right: 0.70vw;
    position: relative;
}

.hero-discount {
    margin-bottom: 1.40vw;
    display: flex;
    justify-content: center;
}

.discount-box {
    background-color: var(--white);
    border: 0.21vw solid var(--primary-color);
    border-radius: 1.40vw;
    padding: 2.10vw 4.20vw;
    box-shadow: var(--shadow-strong);
    position: relative;
    overflow: hidden;
}

.discount-box::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(52, 152, 219, 0.2) 0%, transparent 70%);
    animation: rotate 10s linear infinite;
}

@keyframes rotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.discount-label {
    font-size: 3vw;
    color: var(--text-color);
    margin-bottom: 0;
    position: relative;
    z-index: 1;
}

.discount-content-box {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.70vw;
    margin-bottom: 1.05vw;
    position: relative;
    z-index: 1;
}

.discount-percent {
    font-size: 5.03vw;
    font-weight: 900;
    color: var(--primary-color);
    line-height: 1;
}

.discount-off {
    font-size: 2.52vw;
    font-weight: 900;
    color: var(--primary-color);
}

.discount-detail {
    font-size: 1.26vw;
    font-weight: 700;
    position: relative;
    z-index: 1;
}

.strike {
    text-decoration: line-through;
    color: var(--gray-dark);
    margin: 0 0.35vw;
}

.highlight-price {
    color: var(--primary-color);
    font-size: 1.68vw;
}


/* 実績サークル */
.achievement-circles {
    display: flex;
    justify-content: flex-start;
    gap: 2.10vw;
    margin-top: 2.80vw;
    margin-bottom: 1.40vw;
    flex-wrap: wrap;
}

.achievement-circle {
    width: 11.19vw;
    height: 11.19vw;
    background: linear-gradient(145deg, #6BB6FF 0%, #3498DB 45%, #2874A6 100%);
    border: none;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow:
        inset 0 -0.35vw 1.05vw rgba(0, 0, 0, 0.3),
        inset 0 0.35vw 0.70vw rgba(255, 255, 255, 0.5),
        0 0.56vw 1.75vw rgba(52, 152, 219, 0.4);
    transition: all 0.3s ease;
    padding: 0.70vw;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.achievement-circle::before {
    content: '';
    position: absolute;
    top: 8%;
    left: 15%;
    width: 50%;
    height: 35%;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.5) 40%, transparent 70%);
    border-radius: 50%;
    transform: rotate(-30deg);
}

.achievement-circle::after {
    content: '';
    position: absolute;
    top: 60%;
    right: 15%;
    width: 20%;
    height: 20%;
    background: radial-gradient(circle at center, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.2) 50%, transparent 70%);
    border-radius: 50%;
}

.achievement-circle:hover {
    transform: translateY(-0.35vw) scale(1.05);
    box-shadow:
        inset 0 -0.35vw 1.40vw rgba(0, 0, 0, 0.4),
        inset 0 0.35vw 1.05vw rgba(255, 255, 255, 0.6),
        0 0.84vw 2.45vw rgba(46, 134, 222, 0.5);
}

.achievement-main {
    font-size: 2.24vw;
    font-weight: 900;
    color: #FFEB3B;
    text-shadow: 0 0.14vw 0.28vw rgba(0, 0, 0, 0.2);
    line-height: 1.2;
    display: block;
    margin-bottom: 0.56vw;
}

.achievement-main + .achievement-main {
    margin-top: -0.35vw;
    margin-bottom: 0;
}

.achievement-main-small {
    font-size: 1.85vw;
}

.achievement-main-large {
    font-size: 2.66vw;
}

.achievement-sub {
    font-size: 0.98vw;
    font-weight: 700;
    color: var(--white);
    text-shadow: 0 0.07vw 0.14vw rgba(0, 0, 0, 0.2);
    line-height: 1.2;
    display: block;
}

/* 新しいヒーローセクション要素 */
/* hero-top-container - バッジとタイムハイライトのコンテナ */
.hero-top-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    z-index: 10;
    margin-bottom: 2.10vw;
    margin-top: .40vw;
    transform: translateY(9.5vw);
}

.hero-certification-badge {
    position: relative;
    z-index: 2;
}

.certification-circle {
    width: 11.19vw;
    height: 11.19vw;
    background: rgba(52, 152, 219, 0.4);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 1.12vw;
    box-shadow: 0 0.45vw 1.68vw rgba(0, 0, 0, 0.2);
    position: relative;
}

.japan-map {
    position: absolute;
    width: 80%;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
    z-index: 1;
    pointer-events: none;
}

.cert-country {
    font-size: 1.60vw;
    margin-bottom: 0vw;
    position: relative;
    z-index: 10;
    color: #ffffff;
}

.cert-main {
    font-size: 1.6vw;
    font-weight: 900;
    margin-top: -0.35vw;
    margin-bottom: 0vw;
    position: relative;
    z-index: 10;
    color: #ffffff;
}

.cert-sub {
    font-size: 0.80vw;
    line-height: 1.1;
    position: relative;
    z-index: 10;
    color: #ffffff;
}

.hero-main-content {
    position: relative;
    z-index: 5;
    padding: 0vw 4.80vw;
    width: 100%;
    margin: 0 auto;
}

.hero-catchcopy {
    margin-top: -3.5vw;
    margin-bottom: 0.80vw;
    position: relative;
    z-index: 2;
}

.hero-main-title {
    margin-bottom: 0vw;
    text-align: left;
}

.time-highlight {
    display: inline-block;
    margin-bottom: 0;
    position: relative;
    margin-left: -1.40vw;
    z-index: 2;
    font-style: italic;
}

.time-stroke-layer {
    position: relative;
    z-index: 1;
    white-space: nowrap;
    display: inline-block;
    overflow: visible;
}

.time-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    white-space: nowrap;
    display: inline-block;
    overflow: visible;
}

.time-number {
    font-size: 8.60vw;
    font-weight: 900;
    background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    padding-right: 1.26vw;
    margin-right: -0.35vw;
}

.time-number-stroke {
    font-size: 8.60vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.63vw white;
    display: inline;
    padding-right: 1.26vw;
    margin-right: -0.35vw;
}

.time-unit {
    font-size: 4.43vw;
    font-weight: 900;
    background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-right: -0.35vw;
    padding-right: 0.95vw;
}

.time-unit-stroke {
    font-size: 4.43vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.63vw white;
    display: inline;
    margin-right: -0.35vw;
    padding-right: 0.95vw;
}

.time-prefix {
    font-size: 3.50vw;
    font-weight: 900;
    background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-right: 0vw;
    padding-right: 0.70vw;
}

.time-prefix-stroke {
    font-size: 3.50vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.63vw white;
    display: inline;
    margin-right: 0vw;
    padding-right: 0.70vw;
}

.time-suffix {
    font-size: 3.50vw;
    font-weight: 900;
    background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    padding-right: 0.35vw;
}

.time-suffix-stroke {
    font-size: 3.50vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.63vw white;
    display: inline;
    padding-right: 0.35vw;
}

.service-title {
    display: inline-block;
    margin-bottom: 1.05vw;
    position: relative;
    font-style: italic;
    text-align: center;
}

.service-stroke-layer {
    position: relative;
    z-index: 1;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.service-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.service-text-stroke {
    font-size: 4.20vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.42vw white;
    display: inline;
}

.service-text {
    font-size: 4.20vw;
    font-weight: 900;
    background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.service-word {
    margin-right: -0.28vw;
}

.service-word-tsumari {
    letter-spacing: -0.15vw;
}

.service-dot {
    margin-left: -5.05vw;
    margin-right: -5.05vw;
}

.hero-subtitle {
    font-size: 1.26vw;
    color: #34495E;
    font-weight: 500;
    margin-bottom: 2.10vw;
}

@media (min-width: 769px) {
    .hero-subtitle-details {
        position: relative;
        display: inline-block;
        font-style: italic;
        margin-right: -1.3vw;
        margin-left: -2.1vw;
    }
}

.hero-main-stroke-layer {
    position: relative;
    z-index: 1;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.hero-main-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.hero-main-text-stroke {
    font-size: 1.05vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.11vw white;
    display: inline;
    padding-right: 0.21vw;
}

.hero-main-text-stroke.hero-main-large {
    font-size: 2.40vw ;
    -webkit-text-stroke: 0.54vw white;
}

.hero-main-text-stroke.hero-main-small {
    font-size: 2.40vw;
    -webkit-text-stroke: 0.54vw white;
}

/* ！マークの傾きと位置調整 */
.hero-exclamation {
    display: inline-block;
    transform: rotate(10deg);
    margin-left: -0.70vw;
}

.hero-main-text {
    font-size: 1.05vw;
    font-weight: 900;
    background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    padding-right: 0.21vw;
}

.hero-main-large {
    font-size: 2.40vw;
}

.speed-tight {
    letter-spacing: -0.26vw;
}

.toilet-tight {
    letter-spacing: -0.36vw;
    margin-right: 0.36vw;
}

.tsumari-tight {
    letter-spacing: -0.36vw;
}

.hero-main-small {
    font-size: 2.40vw;
}

/* 吹き出しスタイル */
.hero-speech-bubble {
    position: absolute;
    left: 3vw;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    background: white;
    padding: 0.70vw 0.70vw;
    border-radius: 1.05vw;
    box-shadow: 0 0.28vw 0.70vw rgba(0, 0, 0, 0.1);
    margin-top: 1.40vw;
    margin-bottom: 1.40vw;
    z-index: 2;
}

.hero-speech-bubble::before {
    content: '';
    position: absolute;
    top: 3.70vw;
    right: -1.00vw;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0.70vw 0.70vw 0.70vw;
    border-color: transparent transparent white transparent;
    transform: rotate(90deg);
}

.speech-bubble-text {
    font-weight: 700;
    color: #1c54c9;
    display: inline;
}

.speech-bubble-main {
    font-size: 1.5vw;
    margin-left: -0.07vw;
    margin-right: -0.07vw;
}

.speech-bubble-small {
    font-size: 0.70vw;
}

.speech-bubble-main-text {
    display: flex;
    align-items: baseline;
    justify-content: center;
}

.speech-bubble-disclaimer {
    font-size: 0.86vw;
    color: #666;
    font-weight: 400;
}

/* デフォルト（デスクトップ）スタイル */
@media (min-width: 769px) {
    .hero-subtitle-container {
        display: flex;
        flex-direction: row;
        align-items: baseline;
        justify-content: flex-start;
        gap: 0;
        margin-bottom: 0vw;
        margin-top: -1.40vw;
        margin-left: 0;
        margin-right: auto;
    }
}

@media (min-width: 769px) {
    .hero-subtitle-left {
        position: relative;
        display: inline-block;
        font-style: italic;
    }

    .hero-subtitle-right {
        display: flex;
        flex-direction: row;
        align-items: baseline;
        gap: 0;
        margin-top: 0;
        margin-left: 0;
    }

    .hero-subtitle-action {
        position: relative;
        display: inline-block;
        font-style: italic;
        margin-top: 0;
        margin-left: 0;
    }
}

.hero-details-stroke-layer {
    position: relative;
    z-index: 1;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.hero-details-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    white-space: nowrap;
    display: inline;
    width: 100%;
    overflow: visible;
}

.hero-details-text-stroke {
    font-size: 2.40vw;
    font-weight: 900;
    color: white;
    -webkit-text-stroke: 0.54vw white;
    display: inline;
    padding-right: 0.20vw;
}

.hero-details-text {
    font-size: 2.40vw;
    font-weight: 900;
    background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    padding-right: 0.20vw;
}

.discount-badge {
    display: inline-flex;
    align-items: center;
    gap: 0;
    /* margin: 30px 0 20px 0; */ /* PC: 2.10vw 0 1.40vw 0, Mobile: 別途設定 */
    overflow: visible;
    position: relative;
    z-index: 2;
}

.discount-label {
    background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
    color: white;
    /* padding: 8px 15px; */ /* PC: 0.56vw 1.05vw, Mobile: 別途設定 */
    /* border-radius: 2px; */ /* PC: 0.14vw, Mobile: 別途設定 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    font-weight: 700;
    line-height: 1.2;
    /* font-size: 12px; */ /* PC: 0.84vw, Mobile: 別途設定 */
}

.discount-label span {
    display: block;
}

.discount-amount {
    margin-left: 0.5vw;
    position: relative;
    display: inline-block;
    overflow: visible;
    /* transform: translateY(-3px); */ /* PC: translateY(-0.21vw), Mobile: 別途設定 */
}

.discount-stroke-layer {
    position: relative;
    z-index: 1;
    white-space: nowrap;
    display: inline;
}

.discount-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    white-space: nowrap;
    display: inline;
}

.discount-text-stroke {
    /* font-size: 63px; */ /* PC: 4.41vw, Mobile: 別途設定 */
    font-weight: 900;
    color: white;
    /* -webkit-text-stroke: 3px white; */ /* PC: 0.21vw, Mobile: 別途設定 */
    display: inline-block;
    font-stretch: normal;
    font-style: italic;
    transform: scaleX(1.0) scaleY(1.5);
    transform-origin: center;
}

.discount-text {
    /* font-size: 63px; */ /* PC: 4.41vw, Mobile: 別途設定 */
    font-weight: 900;
    background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: inline-block;
    font-stretch: normal;
    font-style: italic;
    transform: scaleX(1.0) scaleY(1.5);
    transform-origin: center;
}

.discount-number {
    letter-spacing: -0.1vw;
}

.discount-comma {
    font-size: 1.98vw; /* 1920px時38px相当 */
    margin-left: -0.3vw;
    margin-right: -0.3vw;
}

.discount-comma-stroke {
    font-size: 1.98vw; /* 1920px時38px相当 */
    margin-left: -0.3vw;
    margin-right: -0.3vw;
}

.discount-unit-stroke {
    /* font-size: 27px; */ /* PC: 1.89vw, Mobile: 別途設定 */
    font-weight: 700;
    color: white;
    /* -webkit-text-stroke: 2px white; */ /* PC: 0.14vw, Mobile: 別途設定 */
    /* padding-right: 4px; */ /* PC: 0.28vw, Mobile: 別途設定 */
}

.discount-unit {
    /* font-size: 27px; */ /* PC: 1.89vw, Mobile: 別途設定 */
    font-weight: 700;
    background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    /* padding-right: 4px; */ /* PC: 0.28vw, Mobile: 別途設定 */
}

.discount-off-stroke {
    /* font-size: 30px; */ /* PC: 2.10vw, Mobile: 別途設定 */
    font-weight: 900;
    color: white;
    /* -webkit-text-stroke: 3px white; */ /* PC: 0.21vw, Mobile: 別途設定 */
    display: inline-block;
    font-stretch: normal;
    font-style: italic;
    transform: scaleX(1.0) scaleY(1.1) translateY(0.7vw);
    transform-origin: center;
    padding-right: 1vw;
    margin-left: -0.1vw;
}

.discount-off {
    /* font-size: 30px; */ /* PC: 2.10vw, Mobile: 別途設定 */
    font-weight: 900;
    background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: inline-block;
    font-stretch: normal;
    font-style: italic;
    transform: scaleX(1.0) scaleY(1.1) translateY(0.7vw);
    transform-origin: center;
    padding-right: 1vw;
    margin-left: -0.1vw;
}

.payment-methods {
    margin-top: 1.56vw; /* 1920px時30px相当 */
}

.payment-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 0.31vw; /* 1920px時6px相当 */
    width: 100%;
    max-width: 10.42vw; /* 1920px時200px相当 */
    position: relative;
    z-index: 0;
}

.payment-card-top {
    grid-column: 1 / 3;
    background: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 0.05vw 0.21vw 0.10vw 0.21vw; /* 1920px時1px 4px 10px 4px相当 */
    min-height: 2.60vw; /* 1920px時50px相当 */
}

.payment-card-bottom {
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.31vw 0.21vw; /* 1920px時6px 4px相当 */
    min-height: 1.56vw; /* 1920px時30px相当 */
}

.payment-text-top {
    font-weight: 700;
    color: #1c54c9;
    font-size: 0.63vw; /* 1920px時12px相当 */
    text-align: center;
    width: 100%;
    font-family: 'M PLUS Rounded 1c', sans-serif;
}

.payment-text-bottom {
    font-weight: 700;
    color: #1c54c9;
    font-size: 0.57vw; /* 1920px時11px相当 */
    text-align: center;
    width: 100%;
    font-family: 'M PLUS Rounded 1c', sans-serif;
}

.cardbrand-image {
    width: 90%;
    max-width: 100%;
    height: auto;
    margin-top: auto;
    margin-bottom: 0.2vw; /* 1920px時-5px相当 */
    object-fit: contain;
}

.payment-bottom-card {
    background: white;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 2;
}

.bottom-card-image {
    /* width: calc(33.333% - 6px); */ /* PC: calc(33.333% - 0.42vw), Mobile: 別途設定 */
    height: 100%;
    object-fit: cover;
    /* border-radius: 2px; */ /* PC: 0.14vw, Mobile: 別途設定 */
}

.payment-icon.rpay {
    color: #BF0000;
}

.payment-icon.credit .visa {
    color: #1A1F71;
    /* margin-right: 5px; */ /* PC: 0.35vw, Mobile: 1.33vw */
}

.payment-icon.credit .master {
    color: #EB001B;
}

.payment-icon.vpoint {
    color: #7B68EE;
}

.hero-worker {
    position: absolute;
    right: 0vw;
    bottom: 0vw;
    width: 58.57vw;
    height: 44.8vw;
    z-index: 1;
}

.hero-worker img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* CTA エリア */
.hero-cta-area {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    /* gap: 30px; */ /* PC: 2.10vw, Mobile: 別途設定 */
    /* margin-bottom: 80px; */ /* PC: 5.59vw, Mobile: 別途設定 */
    /* margin-top: 20px; */ /* PC: 1.40vw, Mobile: 別途設定 */
    flex-wrap: wrap;
    align-content: center;
    position: relative;
    z-index: 5;
}

.cta-phone {
    display: inline-flex;
    align-items: center;
    gap: 1.05vw;
    background-color: var(--primary-color);
    color: var(--white);
    padding: 1.40vw 3.50vw;
    border-radius: 3.50vw;
    text-decoration: none;
    font-weight: 700;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    order: 1;
}

.cta-phone::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.cta-phone:hover::before {
    width: 20.98vw;
    height: 20.98vw;
}

.cta-phone:hover {
    transform: translateY(-0.21vw);
}

.cta-icon {
    width: 3.0vw;
    height: auto;
    position: relative;
    z-index: 1;
}

.cta-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    z-index: 1;
}

.cta-small {
    font-size: 1.2vw;
    opacity: 0.9;
    margin-bottom: 0.05vw;
}

.cta-large {
    font-size: 1.96vw;
    letter-spacing: 0.07vw;
    transform: scaleY(1.2);
    transform-origin: center;
    display: inline-block;
}

.cta-arrow {
    font-size: 2.52vw;
    position: relative;
    z-index: 1;
    animation: arrow-move 1s infinite;
}

@keyframes arrow-move {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(0.35vw); }
}


.safety-badges {
    display: flex;
    flex-direction: row;
    gap: 1.05vw;
    margin-top: 0px;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    order: 3;
    position: relative;
    z-index: 10;
}

.badge {
    background-color: rgba(0, 0, 0, 0.8);
    color: var(--white);
    padding: 0.56vw 1.40vw;
    border-radius: 2.10vw;
    font-size: 0.98vw;
    font-weight: 700;
}

/* CTAバー */
.cta-bar {
    background-color: var(--white);
    padding: 0.70vw 0;
}

.cta-container {
    max-width: 83.92vw;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.70vw;
}

/* CTAバーの電話ボタン内のテキストを中央揃え（PC版のみ） */
.cta-bar .cta-text {
    align-items: center;
}

/* 取り扱いメーカーのご紹介セクション */
.makers-section {
    padding: 0;
    background: var(--white);
}

.makers-header {
    background: #FFF9C4;
    padding: 2.10vw 0;
    text-align: center;
}

.makers-title {
    font-size: 2.10vw;
    font-weight: 900;
    color: #FF6F00;
    margin: 0;
}

.makers-content {
    padding: 4.20vw;
    max-width: 83.92vw;
    margin: 0 auto;
}

.makers-description {
    font-size: 1.26vw;
    line-height: 1.8;
    margin-bottom: 2.10vw;
    text-align: left;
}

.makers-box {
    background: var(--white);
    border: 0.21vw solid #1976D2;
    border-radius: 1.05vw;
    padding: 2.10vw;
    margin-bottom: 2.10vw;
}

.makers-box-title {
    background: #1976D2;
    color: var(--white);
    font-size: 1.68vw;
    font-weight: 900;
    padding: 1.05vw 2.10vw;
    margin: -2.10vw -2.10vw 1.40vw -2.10vw;
    border-radius: 0.84vw 0.84vw 0 0;
    text-align: center;
}

.makers-list {
    font-size: 1.40vw;
    line-height: 1.8;
    margin: 0;
    text-align: center;
    font-weight: 700;
    word-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word;
}

.makers-note {
    font-size: 1.12vw;
    line-height: 1.6;
    text-align: center;
    margin: 0;
}

/* 対応エリアセクション */
.area-section {
    padding: 0;
    background: var(--white);
}

.area-header {
    background: #FFF9C4;
    padding: 2.10vw 0;
    text-align: center;
}

.area-title {
    font-size: 2.10vw;
    font-weight: 900;
    color: #FF6F00;
    margin: 0;
}

.area-content {
    padding: 4.20vw;
    max-width: 83.92vw;
    margin: 0 auto;
}

.area-description {
    font-size: 1.26vw;
    line-height: 1.8;
    margin-bottom: 2.10vw;
    text-align: left;
}

.area-note {
    display: block;
    font-size: 1.05vw;
    margin-top: 0.70vw;
}

.area-map {
    text-align: center;
    margin-top: 2.10vw;
}

.japan-map-image {
    max-width: 50%;
    height: auto;
}

/* WEBキャンペーン情報セクション */
.campaign-section {
    position: relative;
    overflow: hidden;
}

.campaign-section::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120%;
    height: 120%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, rgba(255, 238, 140, 0) 70%);
    pointer-events: none;
}

.campaign-container {
    position: relative;
    z-index: 1;
    text-align: center;
}

.campaign-ribbon {
    position: relative;
    max-width: 90%;
}

.ribbon-image {
    width: 100%;
    height: auto;
    display: block;
}

.ribbon-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: 900;
    color: #ffffff;
    white-space: nowrap;
}

.campaign-content {
}

.campaign-description {
    position: relative;
    display: inline-block;
    font-weight: 700;
    line-height: 1.6;
}

.campaign-description-stroke-layer {
    position: relative;
    display: inline;
    color: #9E9E9E;
    z-index: 1;
}

.campaign-description-text-layer {
    position: absolute;
    top: 0;
    left: 0;
    display: inline;
    color: #1a1a1a;
    z-index: 2;
}

.campaign-label {
    font-weight: 700;
    color: #C62828;
}

.campaign-discount {
    position: relative;
    display: inline-block;
}

.campaign-discount-stroke-layer {
    position: relative;
    display: inline;
    white-space: nowrap;
    z-index: 1;
}

.campaign-discount-gradient-layer {
    position: absolute;
    top: 0;
    left: 0;
    display: inline;
    white-space: nowrap;
    z-index: 2;
}

.campaign-price-stroke,
.campaign-price {
    font-weight: 900;
    line-height: 1;
    font-family: 'Noto Sans JP', sans-serif;
    display: inline-block;
    vertical-align: middle;
}

.campaign-price-stroke {
    color: #9E9E9E;
}

.campaign-price {
    color: #C62828;
}

.campaign-price-sub-stroke,
.campaign-price-sub {
    display: inline-block;
    vertical-align: middle;
}

.campaign-tax-stroke,
.campaign-tax {
    font-weight: 700;
    line-height: 1;
    font-family: 'Noto Sans JP', sans-serif;
    display: block;
}

.campaign-tax-stroke {
    color: #9E9E9E;
}

.campaign-tax {
    color: #C62828;
}

.campaign-unit-stroke,
.campaign-unit {
    font-weight: 900;
    line-height: 1;
    font-family: 'Noto Sans JP', sans-serif;
    display: block;
}

.campaign-unit-stroke {
    color: #9E9E9E;
}

.campaign-unit {
    color: #C62828;
}

.campaign-off-stroke,
.campaign-off {
    font-weight: 900;
    line-height: 1;
    font-family: 'Noto Sans JP', sans-serif;
    display: inline-block;
    vertical-align: middle;
}

.campaign-off-stroke {
    color: #9E9E9E;
}

.campaign-off {
    color: #C62828;
}

/* セクション共通スタイル */
section {
}

.section-title {
    text-align: center;
    margin-top: 40px;
    margin-bottom: 60px;
}

.title-en {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--primary-color);
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.title-ja {
    display: block;
    font-size: 36px;
    font-weight: 900;
    color: var(--text-color);
}

/* 症状別料金 */
.symptoms-section {
    background-color: #F0F8FF;
    padding: 0;
}

.symptoms-header {
    background: linear-gradient(135deg, #4A90E2 0%, #63B3ED 100%);
    padding: 0px 0;
    position: relative;
    overflow: hidden;
}

.symptoms-header::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 60%;
    height: 100%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
    animation: float 15s ease-in-out infinite;
}

.symptoms-main-title {
    text-align: center;
    color: var(--white);
    margin: 0;
}

.symptoms-main-title .title-en {
    display: block;
    font-size: 32px;
    font-weight: 900;
    letter-spacing: 2px;
    margin-bottom: 5px;
}

.price-highlight {
    display: block;
    font-size: 18px;
    margin-bottom: 5px;
    position: relative;
}

.price-value {
    font-size: 28px;
    font-weight: 900;
    color: #FFEB3B;
    margin-left: 1vw;
}

.symptoms-main-title .title-ja {
    display: block;
    font-size: 24px;
    font-weight: 700;
}

.symptoms-section .container {
    padding: 1.05vw 0.70vw;
}

.symptoms-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.75vw;
    margin-bottom: 2.80vw;
}

.symptom-card {
    background: var(--white);
    border-radius: 1.40vw;
    box-shadow: 0 0.56vw 1.75vw rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.symptom-card:hover {
    transform: translateY(-0.70vw);
    box-shadow: 0 1.05vw 2.80vw rgba(0, 0, 0, 0.15);
}

.symptom-category {
    background: linear-gradient(135deg, #2196F3 0%, #1976D2 100%);
    color: var(--white);
    padding: 1.05vw;
    text-align: center;
    font-size: 1.40vw;
    font-weight: 700;
    letter-spacing: 0.07vw;
}

.symptom-image {
    position: relative;
    height: 13.99vw;
    background: #f5f5f5;
    overflow: hidden;
}

.symptom-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.work-time-badge {
    position: absolute;
    top: 1.05vw;
    right: 1.05vw;
    background: #FF6B6B;
    color: var(--white);
    border-radius: 50%;
    width: 5.59vw;
    height: 5.59vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0.28vw 1.05vw rgba(255, 107, 107, 0.3);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.badge-label {
    font-size: 0.70vw;
    line-height: 1.2;
    margin-bottom: 0.14vw;
}

.badge-time {
    font-size: 1.12vw;
    font-weight: 900;
}

.symptom-content {
    padding: 1.75vw 1.40vw;
}

.symptom-title {
    font-size: 1.40vw;
    color: var(--text-color);
    margin-bottom: 1.40vw;
    line-height: 1.4;
    font-weight: 700;
}

.price-divider {
    border-top: 2px dotted #1976D2;
    margin: 1.40vw 0;
}

.price-display {
    text-align: center;
    margin-bottom: 0.70vw;
}

.price-note {
    font-size: 1.0vw;
    color: #666;
    text-align: center;
    margin: 0;
}

.price-number {
    font-size: 3.36vw;
    font-weight: 900;
    color: #FF6B6B;
    background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.price-unit {
    font-size: 1.40vw;
    font-weight: 700;
    color: #FF6B6B;
}

.note-highlight {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 2.0vw;
    margin-bottom: 1.0vw;
}

.price-note p {
    color: var(--text-light);
    line-height: 1.6;
    margin: 5px 0;
    font-size: 1.2vw;
}

@media (max-width: 1024px) {
    .symptoms-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .symptoms-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .symptoms-main-title .title-en {
        font-size: 36px;
    }
    
    .price-value {
        font-size: 32px;
    }
    
    .symptoms-main-title .title-ja {
        font-size: 28px;
    }
}

/* 水道救急隊24が選ばれる5つの理由 */
.five-reasons-section {
    background: linear-gradient(135deg, #E3F2FD 0%, #BBDEFB 100%);
    padding: 5.59vw 0;
}

.five-reasons-header {
    text-align: center;
    margin-bottom: 4.20vw;
}

.achievement-stat {
    background: var(--white);
    display: inline-flex;
    align-items: center;
    gap: 0.35vw;
    padding: 1.05vw 2.10vw;
    border-radius: 3.50vw;
    box-shadow: 0 0.28vw 1.05vw rgba(0, 0, 0, 0.1);
    margin-bottom: 2.10vw;
    border-bottom: 0.21vw solid var(--primary-color);
    position: relative;
}

.stat-text {
    font-size: 0.98vw;
    color: var(--text-color);
    font-weight: 700;
}

.stat-number {
    font-size: 1.96vw;
    font-weight: 900;
    color: var(--primary-color);
}

.stat-unit {
    font-size: 1.26vw;
    font-weight: 700;
    color: var(--secondary-color);
}

.five-reasons-title {
    font-size: 2.24vw;
    font-weight: 900;
    color: var(--text-color);
    margin: 0;
}

.company-name {
    color: var(--primary-color);
}

.reason-count {
    color: var(--secondary-color);
}

.five-reasons-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.five-reasons-grid .reason-04,
.five-reasons-grid .reason-05 {
    grid-column: span 1;
}

.five-reason-item {
    background: var(--white);
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.five-reason-item:hover {
}

.reason-header {
    background: linear-gradient(135deg, var(--primary-color) 0%, #2E86DE 100%);
    color: var(--white);
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.reason-header::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 100%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
    animation: float 8s ease-in-out infinite;
}

.reason-label {
    font-weight: 700;
}

.reason-number {
    font-weight: 900;
}

.reason-title {
    font-weight: 700;
    color: var(--text-color);
    line-height: 1.4;
    margin: 0;
}

.highlight-yellow {
    color: #df4901;
    background: linear-gradient(135deg, #ff6b35 0%, #df4901 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: none;
    font-weight: 900;
}

.sub-title {
    display: block;
    color: var(--text-light);
    font-weight: 500;
}

.reason-image {
}

.reason-image img {
    width: 100%;
    height: 15vw;
    object-fit: cover;
    object-position: center 15%;
}

.reason-description {
    line-height: 1.7;
    color: var(--text-light);
    margin: 0;
}

/* グリッドの最下段を中央寄せ */
@media (min-width: 1024px) {
    .five-reasons-grid {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto auto;
    }
    
    .reason-04 {
        grid-column: 1 / 2;
        grid-row: 2;
        margin: 0 auto;
    }
    
    .reason-05 {
        grid-column: 3 / 4;
        grid-row: 2;
        margin: 0 auto;
    }
}

@media (min-width: 1024px) {
    .five-reasons-title .company-name {
        font-size: 32px;
    }
}

@media (max-width: 1023px) {
    .five-reasons-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .reason-05 {
        grid-column: 1 / -1;
        max-width: 400px;
        margin: 0 auto;
    }
}

@media (max-width: 767px) {
    .five-reasons-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .reason-05 {
        grid-column: 1;
        max-width: none;
    }
    
    .five-reasons-title {
        font-size: 24px;
    }
    
    .reason-count {
        font-size: 32px;
    }

    .company-name {
        font-size: 32px;
    }
}

/* 選ばれる理由 */
.reasons-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 40px;
}

.reason-item {
    text-align: center;
    position: relative;
}

.reason-number {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 80px;
    font-weight: 900;
    color: rgba(52, 152, 219, 0.1);
    z-index: 0;
}

.reason-icon {
    font-size: 60px;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

.reason-item h3 {
    font-size: 22px;
    margin-bottom: 15px;
    color: var(--primary-color);
    position: relative;
    z-index: 1;
}

.reason-item p {
    color: var(--text-light);
    line-height: 1.8;
    position: relative;
    z-index: 1;
}

/* 施工事例 */
.cases-section {
    background-color: var(--gray-light);
}

.cases-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(24.48vw, 1fr));
    gap: 2.10vw;
}

.case-card {
    background-color: var(--white);
    border-radius: 1.05vw;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.case-header {
    background-color: #f0f0f0;
    padding: 1.05vw 1.40vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.case-type {
    background-color: var(--primary-color);
    color: var(--white);
    padding: 0.35vw 1.05vw;
    border-radius: 1.40vw;
    font-size: 0.98vw;
    font-weight: 700;
}

.case-time {
    font-size: 0.98vw;
    color: var(--text-light);
}

.case-content {
    padding: 2.10vw;
}

.case-price {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.40vw;
    padding-bottom: 1.40vw;
    border-bottom: 0.14vw solid var(--gray-medium);
}

.price-label {
    font-size: 1.12vw;
    color: var(--text-light);
}

.price-amount {
    font-size: 2.24vw;
    font-weight: 900;
    color: var(--primary-color);
}

.case-comment {
    font-size: 1.12vw;
    line-height: 1.8;
    margin-bottom: 1.05vw;
    position: relative;
    padding-left: 1.40vw;
}

.case-comment::before {
    content: '"';
    position: absolute;
    left: 0;
    top: -0.70vw;
    font-size: 2.80vw;
    color: var(--primary-color);
    opacity: 0.3;
}

.case-info {
    text-align: right;
    font-size: 0.98vw;
    color: var(--text-light);
}

/* 対応の流れ */
.flow-steps {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 69.93vw;
    margin: 0 auto;
    position: relative;
}

.flow-step {
    flex: 1;
    text-align: center;
    padding: 1.05vw 0.70vw;
    background-color: var(--white);
    border-radius: 0;
    box-shadow: var(--shadow);
    position: relative;
    z-index: 1;
    height: 27.97vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.step-number {
    background-color: var(--primary-color);
    color: var(--white);
    font-size: 0.98vw;
    font-weight: 700;
    padding: 0.35vw 1.05vw;
    border-radius: 1.40vw;
    display: inline-block;
    margin-bottom: 1.40vw;
}

.step-icon {
    margin-bottom: 1.40vw;
    height: 12vw;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.step-icon img {
    width: 16vw;
    height: 12vw;
    object-fit: cover;
    border-radius: 0;
    box-shadow: 0 0.28vw 1.05vw rgba(0, 0, 0, 0.1);
}

.flow-step h3 {
    font-size: 1.40vw;
    margin-bottom: 1.05vw;
    color: var(--primary-color);
    width: 100%;
    flex-shrink: 0;
}

.flow-step p {
    font-size: 0.98vw;
    color: var(--text-light);
    line-height: 1.6;
    width: 100%;
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.flow-arrow {
    font-size: 2.10vw;
    color: var(--primary-color);
    margin: 0 0.70vw;
}

/* FAQ */
.faq-section {
    background-color: var(--gray-light);
}

.faq-list {
    max-width: 55.94vw;
    margin: 0 auto;
}

.faq-item {
    background-color: var(--white);
    margin-bottom: 1.40vw;
    border-radius: 0.70vw;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.faq-question {
    width: 100%;
    padding: 1.40vw 2.10vw;
    background-color: var(--white);
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.26vw;
    font-weight: 700;
    color: var(--text-color);
    transition: background-color 0.3s ease;
}

.faq-question:hover {
    background-color: #f8f8f8;
}

.faq-toggle {
    font-size: 1.68vw;
    color: var(--primary-color);
    transition: transform 0.3s ease;
}

.faq-item.active .faq-toggle {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 13.99vw;
}

.faq-answer p {
    padding: 1.40vw 2.10vw;
    color: var(--text-light);
    line-height: 1.8;
}


/* フッター */
.footer {
    background-color: #f5f5f5;
    color: #333;
}

.footer-container {
    margin: 0 auto;
}

.footer-main-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.footer-section {
    display: flex;
    flex-direction: column;
}

.footer-section-title {
    font-weight: 700;
    color: #333;
}

.footer-table {
    width: 100%;
    border-collapse: collapse;
}

.footer-table tr {
}

.footer-table tr:last-child {
    border-bottom: none;
}

.footer-table th {
    text-align: left;
    font-weight: 700;
    color: #666;
    vertical-align: top;
    background-color: #fafafa;
}

.footer-table td {
    line-height: 1.8;
    color: #333;
}

/* 営業拠点セクション */
.footer-locations {
    display: flex;
    flex-direction: column;
}

.footer-location {
    background-color: white;
}

.location-name {
    background-color: var(--primary-color);
    color: white;
    font-weight: 700;
}

.location-postal {
    color: #333;
}

.location-address {
    line-height: 1.8;
    color: #333;
}

.footer-bottom {
    text-align: center;
    color: #999;
}

/* 固定フッター */
.fixed-footer {
    position: fixed ;
    left: 0 ;
    right: 0 ;
    z-index: 998 ;
    display: flex ;
    flex-direction: column ;
    align-items: center ;
    transform: translateY(0) !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.fixed-footer.show {
    opacity: 1;
    visibility: visible;
}

.footer-bubble {
    background-color: white;
    color: #ff6b35;
    padding: 0.56vw 1.40vw;
    border-radius: 1.40vw;
    font-size: 1.12vw;
    font-weight: 700;
    margin-bottom: -0.07vw;
    box-shadow: 0 0.14vw 0.70vw rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1;
}

.footer-bubble::after {
    content: '';
    position: absolute;
    bottom: -0.56vw;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 0.56vw solid transparent;
    border-right: 0.56vw solid transparent;
    border-top: 0.56vw solid white;
}

.fixed-footer-background {
    background: linear-gradient(135deg, #2B5BA6 0%, #1E4A8A 100%);
    width: 100%;
    padding: 0.4vw 3.0vw 0.4vw;
}

.fixed-footer-content {
    background: #FFE000;
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    text-decoration: none;
    border-radius: 999vw;
    overflow: visible;
    box-shadow: 0 0.4vw 1.2vw rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    position: relative;
}

.fixed-footer-content:hover {
    transform: translateY(-0.2vw);
    box-shadow: 0 0.6vw 1.6vw rgba(0, 0, 0, 0.4);
}

.footer-top-text {
    background: transparent;
    color: #FF0000;
    font-size: 0.6vw;
    font-weight: 700;
    text-align: center;
    padding: 0.15vw 1.5vw 0;
    margin-bottom: -0.05vw;
    position: relative;
    top: 0.1vw;
    -webkit-text-stroke: 0.08vw white;
    text-stroke: 0.08vw white;
    paint-order: stroke fill;
}

.footer-phone-container {
    display: flex;
    align-items: center;
    gap: 0.5vw;
    justify-content: center;
    padding: 0 2.0vw 0 2.0vw;
}

.footer-phone-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-phone-icon {
    width: 2.8vw;
    height: 2.8vw;
    filter: brightness(0) saturate(100%);
    position: absolute;
    left: 1.5vw;
    top: 40%;
    transform: translateY(-50%);
    z-index: 10;
}

.footer-phone-number {
    font-size: 2.2vw;
    font-weight: 900;
    color: #000;
    letter-spacing: 0.05vw;
    font-family: 'Arial', sans-serif;
    -webkit-text-stroke: 0.10vw white;
    text-stroke: 0.10vw white;
    paint-order: stroke fill;
    transform: scaleY(1.1);
}

.footer-finger-icon {
    width: 3.5vw;
    height: auto;
    position: absolute;
    right: 1.5vw;
    bottom: 0.5vw;
    filter: drop-shadow(0 0.2vw 0.4vw rgba(0, 0, 0, 0.2));
    z-index: 10;
}

.footer-bottom-text {
    background: linear-gradient(135deg, #5D4037 0%, #4E342E 100%);
    color: #FFEB3B;
    font-size: 0.5vw;
    font-weight: 700;
    text-align: center;
    padding: 0.12vw 1.5vw 0.12vw 1.5vw;
    margin: -0.05vw 2.5vw 0.15vw 2.5vw;
    border-radius: 1.5vw;
}

/* タイトル部分のサイズ調整 */
.title-problem {
    font-size: 0.90em;
    position: relative;
}

.title-etc {
    font-size: 0.75em;
    position: relative;
}

.title-trouble {
    color: #1a5490;
    font-weight: 700;
    display: inline-block;
    letter-spacing: -0.05em;
}

.trouble-additional {
    font-size: 0.4em;
    color: #1a5490;
    font-weight: 700;
    position: relative;
}

/* 300円〜スタイル */
.price-start {
    display: block;
    font-weight: 900;
    font-style: italic;
    color: #FF0000;
    margin-top: 0;
    letter-spacing: -0.03em;
    position: relative;
}

.price-start .price-suffix {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    line-height: 1;
    vertical-align: bottom;
}

.price-start .price-tax {
    font-size: 0.3em;
    font-style: italic;
    color: #FF0000;
    display: block;
}

.price-start .price-unit {
    font-size: 0.4em;
    font-style: italic;
    color: #FF0000;
    display: block;
}

/* 15分強調スタイル - 削除（新しい定義を使用） */

/* PC版専用スタイル */
@media (min-width: 769px) {
    .hero-top-container {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        position: relative;
        gap: 2.20vw;
        z-index: 10;
        margin-bottom: 0vw;
        transform: translateY(0);
    }
    
    .hero-emergency {
        position: relative;
        margin-bottom: 0;
        margin-top: 0;
        z-index: 10;
    }

    .hero-title .title-small {
        position: relative;
        top: 2.80vw;
    }
    
    .hero-title .title-problem,
    .hero-title .title-etc {
        display: inline;
    }
    
    .hero-title .title-trouble {
        display: block;
        margin-top: 0;
        position: relative;
        top: -1.05vw;
        font-size: 2.5em;
    }
    
    .hero-title .price-start {
        position: relative;
        top: -5.03vw;
        margin-left: 0;
        display: inline-block;
    }
    
    .hero-title .title-large {
        position: relative;
        bottom: 14.13vw;
        margin-left: 22.73vw;
        display: inline-block;
        vertical-align: top;
    }
    
    .achievement-circles {
        position: relative;
        top: -15.38vw;
    }
    
    .achievement-main-large {
        font-size: 2.10vw;
    }
    
    .hero-section {
        height: 38vw;
        min-height: auto;
    }

    /* PC版でhero-main-contentを上に移動 */
    .hero-main-content {
        margin-top: -2vw;
    }

    /* discount-badge、payment-methods、payment-bottom-cardを横並びにする */
    .hero-main-content .discount-badge {
        display: inline-block;
        vertical-align: top;
        margin-right: 2vw;
        margin-top: 0vw;
    }

    /* PC版でdiscount-labelを横並びにする */
    .discount-label {
        flex-direction: row;
        gap: 0.35vw;
        padding: 0.56vw 1.05vw;
        border-radius: 0.14vw;
        font-size: 1.84vw;
    }

    /* PC版でdiscount-commaの間隔を調整 */
    .discount-comma {
        margin-left: 0;
        margin-right: 0;
    }

    .discount-comma-stroke {
        margin-left: 0;
        margin-right: 0;
    }

    /* PC版 割引バッジセクション（px→vw変換） */
    .discount-badge { margin: 2.10vw 0 1.40vw 0; }
    .discount-amount { transform: translateY(-0.21vw); }
    .discount-text-stroke { font-size: 4.41vw; -webkit-text-stroke: 0.21vw white; }
    .discount-text { font-size: 4.41vw; }
    .discount-unit-stroke { font-size: 1.89vw; -webkit-text-stroke: 0.14vw white; padding-right: 0.28vw; }
    .discount-unit { font-size: 1.89vw; padding-right: 0.28vw; }
    .discount-off-stroke { font-size: 2.10vw; -webkit-text-stroke: 0.21vw white; }
    .discount-off { font-size: 2.10vw; }
    .bottom-card-image { width: calc(33.333% - 0.42vw); border-radius: 0.14vw; }
    .payment-icon.credit .visa { margin-right: 0.35vw; }
    .hero-cta-area { gap: 2.10vw; margin-bottom: 5.59vw; margin-top: 1.40vw; }

    /* PC版でspeech-bubble-main-textを特別レイアウトに */
    .speech-bubble-main-text {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.28vw 0.35vw;
    }

    .speech-bubble-main-text .speech-bubble-small:first-child {
        flex-basis: 100%;
        text-align: center;
        order: 1;
    }

    .speech-bubble-main-text .speech-bubble-main {
        order: 2;
        flex: 0 0 auto;
    }

    .speech-bubble-main-text .speech-bubble-small:last-child {
        order: 2;
        flex: 0 0 auto;
    }

    .speech-bubble-small {
        font-size: 1.2vw;
    }

    .hero-main-content .payment-methods {
        display: inline-block;
        vertical-align: top;
        margin-top: 0;
        transform: scale(2.5);
        transform-origin: left top;
    }

    .hero-main-content .payment-bottom-card {
        display: inline-flex;
        vertical-align: top;
        justify-content: center;
        align-items: center;
        position: absolute;
        right: 4.80vw;
        margin-top: 0;
        width: 40.32vw;
        height: 12.6vw;
        gap: 0.8vw;
        padding: 0.6vw;
        transform: scale(0.89);
        transform-origin: right top;
    }

    /* PC版でservice-titleを左寄せ */
    .service-title {
        text-align: left;
        margin-bottom: 0vw;
    }

    /* PC版でservice-textのサイズを調整 */
    .service-word.service-text-stroke {
        font-size: 6.86vw;
        -webkit-text-stroke: 0.69vw white;
        padding-right: 2.74vw;
    }

    .service-text-stroke {
        font-size: 6.86vw;
        -webkit-text-stroke: 0.69vw white;
        padding-right: 2.74vw;
    }

    .service-word.service-text {
        font-size: 6.86vw;
        padding-right: 2.74vw;
    }

    .service-text {
        font-size: 6.86vw;
        padding-right: 2.74vw;
    }

    /* PC版でhero-speech-bubbleの位置とサイズを調整 */
    .hero-speech-bubble {
        left: 57vw;
        bottom: 28.5vw;
        padding: 0.84vw 1.05vw;
        width: auto;
        min-width: 12vw;
    }

    .speech-bubble-main-text {
        white-space: nowrap;
    }

    /* PC版でhero-workerを縮小 */
    .hero-worker {
        transform: scale(0.8);
        transform-origin: right bottom;
        bottom: 1vw;
    }

    /* PC版でcampaign-sectionの上下余白を調整 */
    .campaign-section {
        padding: 3.00vw 0;
        background:
            linear-gradient(to bottom, white 0, white 3.50vw, transparent 3.50vw),
            linear-gradient(to top, white 0, white 2.80vw, transparent 2.80vw),
            repeating-linear-gradient(
                90deg,
                #ffe95e 0,
                #ffe95e 1.40vw,
                #ffee8c 1.40vw,
                #ffee8c 2.80vw
            );
    }

    /* PC版でcampaign-containerを上に移動 */
    .campaign-container {
        position: relative;
        top: -2.10vw;
    }

    /* PC版 キャンペーンセクション（px→vw変換） */
    .campaign-ribbon {
        margin: 0 auto 2.10vw;
        width: 41.96vw;
    }

    .ribbon-text {
        font-size: 1.96vw;
        text-shadow: 0.14vw 0.14vw 0.28vw rgba(0, 0, 0, 0.3);
        letter-spacing: 0.14vw;
    }

    .campaign-content {
        margin-top: 1.40vw;
    }

    .campaign-description {
        font-size: 1.40vw;
        margin: 0 0 1.05vw 0;
    }

    .campaign-description-stroke-layer {
        -webkit-text-stroke: 0.28vw white;
    }

    .campaign-label {
        font-size: 1.68vw;
        margin: 0.70vw 0 0.35vw 0;
    }

    .campaign-discount {
        margin: 0.70vw 0;
    }

    .campaign-price-stroke,
    .campaign-price {
        font-size: 4.90vw;
    }

    .campaign-price-stroke {
        -webkit-text-stroke: 0.28vw white;
        padding-right: 0.21vw;
    }

    .campaign-price {
        padding-right: 0.21vw;
    }

    .campaign-tax-stroke,
    .campaign-tax {
        font-size: 0.98vw;
    }

    .campaign-tax-stroke {
        -webkit-text-stroke: 0.28vw white;
        padding-right: 0.21vw;
    }

    .campaign-tax {
        padding-right: 0.21vw;
    }

    .campaign-unit-stroke,
    .campaign-unit {
        font-size: 2.24vw;
    }

    .campaign-unit-stroke {
        -webkit-text-stroke: 0.28vw white;
        padding-right: 0.21vw;
    }

    .campaign-unit {
        padding-right: 0.21vw;
    }

    .campaign-off-stroke,
    .campaign-off {
        font-size: 3.92vw;
    }

    .campaign-off-stroke {
        -webkit-text-stroke: 0.28vw white;
    }

    .campaign-off {
        padding-right: 0.21vw;
    }

    /* PC版 5つの理由セクション（px→vw変換） */
    .reason-count {
        font-size: 2.94vw;
    }
    .five-reasons-grid {
        gap: 2.10vw;
        margin-bottom: 2.10vw;
    }
    .five-reason-item {
        border-radius: 1.40vw;
        box-shadow: 0 0.56vw 1.75vw rgba(0, 0, 0, 0.1);
    }
    .five-reason-item:hover {
        transform: translateY(-0.70vw);
        box-shadow: 0 1.05vw 2.80vw rgba(0, 0, 0, 0.15);
    }
    .reason-header {
        padding: 1.05vw 1.40vw;
    }
    .reason-label {
        font-size: 0.84vw;
        letter-spacing: 0.07vw;
    }
    .reason-number {
        font-size: 1.68vw;
    }
    .reason-title {
        padding: 2.10vw 1.75vw 1.40vw;
        font-size: 1.26vw;
    }
    .sub-title {
        font-size: 0.98vw;
        margin-top: 0.35vw;
    }
    .reason-image {
        padding: 0 1.75vw;
        margin-bottom: 1.40vw;
    }
    .reason-image img {
        border-radius: 1.05vw;
        box-shadow: 0 0.28vw 1.05vw rgba(0, 0, 0, 0.1);
    }
    .reason-description {
        padding: 0 1.75vw 2.10vw;
        font-size: 0.98vw;
    }

    /* PC版 フッターセクション（px→vw変換） */
    .footer {
        padding: 4.20vw 0 0; /* 60px / 1430 */
    }
    .footer-container {
        max-width: 83.92vw; /* 1200px / 1430 */
        padding: 0 2.80vw; /* 40px / 1430 */
    }
    .footer-main-content {
        gap: 4.20vw; /* 60px / 1430 */
        margin-bottom: 2.80vw; /* 40px / 1430 */
    }
    .footer-section-title {
        font-size: 1.26vw; /* 18px / 1430 */
        margin-bottom: 1.40vw; /* 20px / 1430 */
        padding-bottom: 0.70vw; /* 10px / 1430 */
        border-bottom: 0.14vw solid #e0e0e0; /* 2px / 1430 */
    }
    .footer-table tr {
        border-bottom: 0.07vw solid #e0e0e0; /* 1px / 1430 */
    }
    .footer-table th {
        width: 8.39vw; /* 120px / 1430 */
        padding: 1.12vw 0.84vw; /* 16px 12px / 1430 */
        font-size: 0.98vw; /* 14px / 1430 */
    }
    .footer-table td {
        padding: 1.12vw 0.84vw; /* 16px 12px / 1430 */
        font-size: 0.98vw; /* 14px / 1430 */
    }
    .footer-locations {
        gap: 1.68vw; /* 24px / 1430 */
    }
    .footer-location {
        padding: 1.40vw; /* 20px / 1430 */
        border-radius: 0.56vw; /* 8px / 1430 */
        border: 0.07vw solid #e0e0e0; /* 1px / 1430 */
    }
    .location-name {
        font-size: 1.12vw; /* 16px / 1430 */
        padding: 0.56vw 1.12vw; /* 8px 16px / 1430 */
        margin: -1.40vw -1.40vw 0.84vw -1.40vw; /* -20px -20px 12px -20px / 1430 */
        border-radius: 0.56vw 0.56vw 0 0; /* 8px 8px 0 0 / 1430 */
    }
    .location-postal {
        font-size: 0.98vw; /* 14px / 1430 */
        margin-bottom: 0.28vw; /* 4px / 1430 */
    }
    .location-address {
        font-size: 0.98vw; /* 14px / 1430 */
    }
    .footer-bottom {
        padding: 1.68vw 0; /* 24px / 1430 */
        border-top: 0.07vw solid #e0e0e0; /* 1px / 1430 */
        font-size: 0.84vw; /* 12px / 1430 */
    }

    /* PC版で固定フッターCTAを左下に配置 */
    .fixed-footer {
        left: 0.40vw;
        right: auto;
        bottom: 0.40vw;
        width: 32vw;
    }

    .fixed-footer-background {
        padding: 1.0vw 2.00vw;
        border-radius: 1.40vw;
    }

    /* PC版でフッターテキストのサイズを調整 */
    .footer-top-text {
        font-size: 1.05vw;
    }

    .footer-bottom-text {
        font-size: 0.91vw;
    }

    .footer-phone-number {
        font-size: 2.73vw;
    }

    /* PC版 タイトル部分のサイズ調整（px→vw変換） */
    .title-problem {
        top: 0.28vw; /* 4px / 1430 */
    }

    .title-etc {
        top: 0.28vw; /* 4px / 1430 */
    }

    .title-trouble {
        text-shadow:
            -0.07vw -0.07vw 0 #FFFFFF,
            0.07vw -0.07vw 0 #FFFFFF,
            -0.07vw 0.07vw 0 #FFFFFF,
            0.07vw 0.07vw 0 #FFFFFF,
            0.14vw 0.14vw 0 #FFFFFF,
            -0.14vw -0.14vw 0 #FFFFFF,
            0.14vw -0.14vw 0 #FFFFFF,
            -0.14vw 0.14vw 0 #FFFFFF;
    }

    .trouble-additional {
        margin-left: 0.35vw; /* 5px / 1430 */
        top: -0.35vw; /* -5px / 1430 */
        text-shadow:
            -0.07vw -0.07vw 0 #FFFFFF,
            0.07vw -0.07vw 0 #FFFFFF,
            -0.07vw 0.07vw 0 #FFFFFF,
            0.07vw 0.07vw 0 #FFFFFF,
            0.14vw 0.14vw 0 #FFFFFF,
            -0.14vw -0.14vw 0 #FFFFFF,
            0.14vw -0.14vw 0 #FFFFFF,
            -0.14vw 0.14vw 0 #FFFFFF;
    }

    @keyframes water-wave {
        0%, 100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-0.21vw); /* -3px / 1430 */
        }
    }

    /* PC版 300円〜スタイル（px→vw変換） */
    .price-start {
        font-size: 8.39vw; /* 120px / 1430 */
        text-shadow:
            -0.07vw -0.07vw 0 #FFFFFF,
            0.07vw -0.07vw 0 #FFFFFF,
            -0.07vw 0.07vw 0 #FFFFFF,
            0.07vw 0.07vw 0 #FFFFFF,
            0.14vw 0.14vw 0 #FFFFFF,
            -0.14vw -0.14vw 0 #FFFFFF,
            0.14vw -0.14vw 0 #FFFFFF,
            -0.14vw 0.14vw 0 #FFFFFF;
    }

    .price-start .price-suffix {
        bottom: 2.10vw; /* 30px / 1430 */
        left: 0.56vw; /* 8px / 1430 */
    }

    .price-start .price-tax {
        margin-bottom: 0.14vw; /* 2px / 1430 */
    }

    /* PC版 電話ボタンの色変更 */
    .cta-phone {
        background-color: #FFE000;
        color: #000;
    }

    .cta-phone .cta-icon {
        filter: brightness(0);
    }

    /* PC版 CTAバーの背景色 */
    .cta-bar {
        background-color: #2B5BA6;
    }

}
/* レスポンシブデザイン */
@media (max-width: 768px) {
    html, body {
        width: 100%;
        overflow-x: hidden;
        position: relative;
        margin: 0;
        padding: 0;
    }

    /* ヘッダー（スマホ版） */
    .fixed-header {
        top: 0; /* 画面最上部に配置 */
        height: 20vw;
    }

    /* オペレーターステータスバー（スマホ版） */
    .operator-status-bar {
        top: 19.5vw; /* ヘッダーの底面に密着 */
        padding: 2.33vw; /* 430px時10px */
        font-size: 4.3vw; /* 430px時17px */
        letter-spacing: 0.12vw;
        z-index: 999; /* ヘッダーより下 */
        transition: top 0.3s ease; /* スムーズな移動アニメーション */
    }

    .header-container {
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
        padding: 0 0 0 2.33vw;
        width: 100%;
        max-width: none;
        box-sizing: border-box;
        height: 100%;
    }

    .logo-area {
        flex-shrink: 0;
        align-self: center;
    }

    .logo-area img {
        height: 11vw;
        margin-top: 0;
        transform: scale(1);
    }
    
    .header-cta {
        display: flex;
        align-items: stretch;
        height: 100%;
        margin-left: auto;
    }

    .header-phone {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 0.8vw;
        padding: 2.6vw 1.9vw 3.9vw 1.9vw;
        border-radius: 0;
    }

    /* ヘッダー電話ボタン上部（モバイル版） */
    .header-phone-top {
        display: flex;
        align-items: center;
        gap: 1.5vw;
    }

    /* ヘッダー電話ボタン専用のサイズ（モバイル版） */
    .header-phone .cta-icon {
        width: 4.8vw;
        margin-top: 0.3vw;
        height: auto;
        filter: none;
    }

    .header-phone .cta-small {
        font-size: 2.5vw;
        line-height: 1.3;
        text-align: center;
    }

    .header-phone .cta-large {
        font-size: 4.5vw;
        -webkit-text-stroke: 0;
        text-stroke: 0;
        transform: scaleY(1.4);
        letter-spacing: normal;
    }



    .hero-plumber-mobile {
        display: block;
        position: absolute;
        width: 100.23vw;
        height: 133.49vw;
        right: -20.74vw;
        bottom: 15.95vw;
        z-index: 0;
    }
    
    
    
    .hero-emergency {
        position: relative;
        display: flex;
        align-items: center;
        flex: 0 0 auto;
        margin-top: 15.12vw;
        margin-left: 2.33vw;
    }
    
    .emergency-time {
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
    }
    
    .service-badges {
        position: relative;
        display: flex;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 0.70vw;
        flex: 0 0 auto;
        margin-top: 15.12vw;
        margin-right: 2.33vw;
    }
    
    .service-badge {
        width: 11.63vw;
        height: 11.63vw;
        font-size: 2.56vw;
        flex-shrink: 1;
        padding: 0.47vw;
        white-space: nowrap;
    }
    
    .badge-text {
        font-size: 2.79vw;
    }
    
    .badge-text-kitchen {
        font-size: 2.56vw;
    }
    
    .hero-section {
        width: 100%;
        height: 0;
        min-height: 0;
        padding: 0;
        padding-top: calc(713 / 430 * 100%); /* 165.8% */
        overflow-x: hidden;
        overflow-y: hidden;
        position: relative;
        margin-top: 0.0vw; /* ヘッダー底面(23.5vw) + ステータスバー(約7vw) */
    }

    /* モバイル版の新しいhero-section要素 */
    .hero-top-container {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0;
        z-index: 10;
        margin-bottom: 0.65vw;
    }

    .hero-certification-badge {
        position: relative;
        z-index: 2;
    }

    .certification-circle {
        width: 19.53vw;
        height: 19.53vw;
        background: rgba(52, 152, 219, 0.5);
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: white;
        font-weight: bold;
        text-align: center;
        padding: 2.33vw;
        box-shadow: 0 1.86vw 6.98vw rgba(0, 0, 0, 0.2);
        position: relative;
    }

    .japan-map {
        position: absolute;
        width: 80%;
        height: auto;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        opacity: 1;
        z-index: 1;
        pointer-events: none;
    }

    .cert-country {
        font-size: 3.38vw;
        margin-bottom: 0vw;
        position: relative;
        z-index: 2;
        color: #ffffff;
    }

    .cert-main {
        font-size: 3.38vw;
        font-weight: 900;
        margin-bottom: 0vw;
        margin-top: -0.8vw;
        position: relative;
        z-index: 2;
        color: #ffffff;
    }

    .cert-sub {
        font-size: 1.80vw;
        line-height: 1.1;
        position: relative;
        z-index: 2;
        color: #ffffff;
    }

    .hero-main-content {
        position: absolute;
        top: 9.0vw;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        height: 100%;
        z-index: 5;
        padding: 12.65vw 0vw;
        box-sizing: border-box;
    }

    .hero-catchcopy {
        margin-bottom: 1.5vw;
        margin-top: 7.95vw;
        position: relative;
        z-index: 2;
    }

    .hero-main-title {
        margin-bottom: 0.1vw;
        text-align: center;
    }

    .time-highlight {
        display: inline-block;
        margin-bottom: 0;
        line-height: 1.1;
        position: relative;
        margin-left: -1.83vw;
        z-index: 2;
        font-style: italic;
    }

    .time-stroke-layer {
        position: relative;
        z-index: 1;
        white-space: nowrap;
        display: inline-block;
        overflow: visible;
    }

    .time-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        white-space: nowrap;
        display: inline-block;
        overflow: visible;
    }

    .time-number {
        font-size: 14.49vw;
        font-weight: 900;
        background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 2.8vw;
        margin-right: -0.7vw;
        display: inline-block;
        position: relative;
        top: 0.7vw;
        letter-spacing: -0.5vw;
    }

    .time-number-stroke {
        font-size: 14.49vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.93vw white;
        display: inline-block;
        padding-right: 2.8vw;
        margin-right: -0.7vw;
        position: relative;
        top: 0.7vw;
        letter-spacing: -0.5vw;
    }

    .time-unit {
        font-size: 7.12vw;
        font-weight: 900;
        background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        margin-right: -1vw;
        margin-left: -1.2vw;
        padding-right: 1.16vw;
    }

    .time-unit-stroke {
        font-size: 7.12vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.93vw white;
        display: inline;
        margin-right: -1vw;
        margin-left: -1.2vw;
        padding-right: 1.16vw;
    }

    .time-prefix {
        font-size: 7.00vw;
        font-weight: 900;
        background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        margin-right: -1vw;
        padding-right: 1.35vw;
    }

    .time-prefix-stroke {
        font-size: 7.00vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.93vw white;
        display: inline;
        margin-right: -1vw;
        padding-right: 1.35vw;
    }

    .time-suffix {
        font-size: 7.00vw;
        font-weight: 900;
        background: linear-gradient(180deg, #FFD700 0%, #FF6B35 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 1.35vw;
        display: inline-block;
        position: relative;
        top: 0.3vw;
    }

    .time-suffix-stroke {
        font-size: 7.00vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.93vw white;
        display: inline-block;
        padding-right: 1.35vw;
        position: relative;
        top: 0.3vw;
    }

    .service-title {
        display: inline-block;
        margin-bottom: 0.1vw;
        position: relative;
        font-style: italic;
        line-height: 1.2;
        max-width: 100%;
        width: 100%;
        text-align: center;
    }

    .service-stroke-layer {
        position: relative;
        z-index: 1;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .service-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .service-text-stroke {
        font-size: 12.3vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 1.28vw white;
        display: inline;
        padding-right: 2.61vw;
    }

    .service-text {
        font-size: 12.3vw;
        font-weight: 900;
        background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 2.61vw;
    }

    .service-word-tsumari {
        letter-spacing: -1.0vw;
    }

    .service-dot {
        margin-left: -5.80vw;
        margin-right: -5.80vw;
    }

    .hero-subtitle {
        font-size: 3.72vw;
        color: #34495E;
        font-weight: 500;
        margin-bottom: 6.98vw;
        line-height: 1.3;
    }

    .hero-subtitle-container {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        gap: 0;
        margin-bottom: 0vw;
        margin-top: -1.5vw;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
        width: 100%;
    }

    .hero-subtitle-left {
        position: relative;
        display: inline-block;
        font-style: italic;
        text-align: center;
        transform: translateY(-3vw);
        margin-left: 18vw;
    }

    .hero-subtitle-right {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        margin-top: -1.80vw;
        margin-left: -1.56vw;
    }

    .hero-subtitle-details {
        position: relative;
        display: inline-block;
        font-style: italic;
        text-align: center;
        margin-left: -1.86vw;
    }

    .hero-subtitle-action {
        position: relative;
        display: inline-block;
        font-style: italic;
        text-align: center;
        margin-top: -2.33vw;
    }

    .hero-main-stroke-layer {
        position: relative;
        z-index: 1;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .hero-main-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .hero-main-text-stroke {
        font-size: 7.67vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.96vw white;
        display: inline;
        padding-right: 1.92vw;
    }

    .hero-main-text {
        font-size: 7.67vw;
        font-weight: 900;
        background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 1.92vw;
    }

    .hero-main-large {
        font-size: 13.3vw !important;
    }

    .speed-tight {
        letter-spacing: -1.4vw;
    }

    .toilet-tight {
        letter-spacing: -1.2vw;
        margin-right: 1.2vw;
    }

    .tsumari-tight {
        letter-spacing: -1.2vw;
    }

    .hero-main-small {
        font-size: 6.75vw !important;
    }

    .hero-main-text-stroke.hero-main-large {
        font-size: 13.3vw !important;
        -webkit-text-stroke: 1.06vw white !important;
    }

    .hero-main-text-stroke.hero-main-small {
        font-size: 6.75vw !important;
        -webkit-text-stroke: 0.85vw white !important;
    }

    /* ！マークの傾きと位置調整（モバイル版） */
    .hero-exclamation {
        display: inline-block;
        transform: rotate(10deg) translateY(1.40vw);
        margin-left: -5.5vw;
    }

    /* 吹き出しスタイル（モバイル版） */
    .hero-speech-bubble {
        position: absolute;
        left: 1vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
        background: white;
        padding: 1.33vw 1.33vw;
        border-radius: 3.49vw;
        box-shadow: 0 0.93vw 2.33vw rgba(0, 0, 0, 0.1);
        margin-top: 2.0vw;
        margin-bottom: 4.65vw;
        text-align: center;
        width: 52%;
        margin-left: auto;
        margin-right: auto;
        z-index: 2;
    }

    .hero-speech-bubble::before {
        content: '';
        position: absolute;
        top: 3vw;
        right: -3vw;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 2.33vw 2.33vw 2.33vw;
        border-color: transparent transparent white transparent;
        /* transform: rotate(45deg); */
    }

    .speech-bubble-text {
        font-weight: 700;
        color: #1c54c9;
        display: inline;
    }

    .speech-bubble-main {
        font-size: 4.02vw;
        margin-left: 0vw;
        margin-right: 0vw;
    }

    .speech-bubble-small {
        font-size: 3.14vw;
    }

    .speech-bubble-main-text {
        display: flex;
        align-items: baseline;
        justify-content: center;
    }

    .speech-bubble-disclaimer {
        font-size: 2.33vw;
        color: #666;
        font-weight: 400;
    }

    .hero-details-stroke-layer {
        position: relative;
        z-index: 1;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .hero-details-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        white-space: nowrap;
        display: inline;
        width: 100%;
        overflow: visible;
    }

    .hero-details-text-stroke {
        font-size: 3.28vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.41vw white;
        display: inline;
        padding-right: 0.74vw;
        position: relative;
        top: 0.8vw;
    }

    .hero-details-text {
        font-size: 3.28vw;
        font-weight: 900;
        background: linear-gradient(135deg, #1c54c9 0%, #1b42ae 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 0.00vw;
        position: relative;
        top: 0.8vw;
    }

    .discount-badge {
        display: inline-flex;
        align-items: center;
        gap: 0;
        margin-top: -6vw;
        margin-left: 1vw;
        margin-right: 0;
        margin-bottom: 5.33vw; /* 375px時20px相当 */
        overflow: visible;
        position: relative;
        top: -4.5vw;
        z-index: 2;
    }

    .payment-icon.credit .visa {
        margin-right: 1.33vw; /* 375px時5px相当 */
    }

    .discount-label {
        background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
        color: white;
        padding: 2.4vw 2.2vw;
        border-radius: 0.47vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        box-shadow: 0 1.86vw 6.98vw rgba(240, 29, 1, 0.3);
        font-size: 3.5vw;
        font-weight: 700;
        line-height: 1.2;
    }

    .discount-amount {
        position: relative;
        display: inline-block;
        overflow: visible;
        transform: translateY(-0.7vw);
    }

    .discount-stroke-layer {
        position: relative;
        z-index: 1;
        white-space: nowrap;
        display: inline;
    }

    .discount-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        white-space: nowrap;
        display: inline;
    }

    .discount-text-stroke {
        font-size: 14.5vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.9vw white;
        display: inline-block;
        font-stretch: normal;
        font-style: italic;
        transform: scaleX(1.0) scaleY(1.10);
        transform-origin: center;
    }

    .discount-text {
        font-size: 14.5vw;
        font-weight: 900;
        background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        display: inline-block;
        font-stretch: normal;
        font-style: italic;
        transform: scaleX(1.0) scaleY(1.10);
        transform-origin: center;
    }

    .discount-number {
        letter-spacing: -0.3vw;
    }

    .discount-comma {
        font-size: 7.5vw;
        margin-left: -0.5vw;
        margin-right: -0.5vw;
    }

    .discount-comma-stroke {
        font-size: 7.5vw;
        margin-left: -0.5vw;
        margin-right: -0.5vw;
    }

    .discount-unit-stroke {
        font-size: 4.19vw;
        font-weight: 700;
        color: white;
        -webkit-text-stroke: 0.47vw white;
        padding-right: 0.93vw;
    }

    .discount-unit {
        font-size: 4.19vw;
        font-weight: 700;
        background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        padding-right: 0.93vw;
    }

    .discount-off-stroke {
        font-size: 3.8vw;
        font-weight: 900;
        color: white;
        -webkit-text-stroke: 0.6vw white;
        display: inline-block;
        font-stretch: normal;
        font-style: italic;
        transform: scaleX(1.0) scaleY(1.1) translateY(0.2vw);
        transform-origin: center;
        padding-right: 1.86vw;
        margin-left: -0.6vw;
    }


    .payment-methods {
        margin-top: -12.0vw;
        margin-left: 1vw;
    }

    .payment-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        gap: 1.4vw;
        width: 100%;
        max-width: 55vw;
        position: relative;
        z-index: 0;
    }

    .payment-card-top {
        grid-column: 1 / 3;
        background: white;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding: 0.23vw 0.93vw 2.33vw 0.93vw; /* 430px時1px 4px 10px 4px相当 */
        min-height: 11.6vw; /* 430px時50px相当 */
        width: calc(100% + 8vw);
        margin-left: 0vw;
    }

    .payment-card-bottom {
        background: white;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.4vw 0; /* 430px時6px 0相当 */
        min-height: 7vw; /* 430px時30px相当 */
    }

    .payment-card-wide {
        width: calc(100% + 2vw);
        margin-left: -1vw;
        padding-top: 0;
        padding-bottom: 0.2vw;
    }

    .payment-card-narrow {
        width: calc(100% - 1vw);
        margin-left: 0vw;
    }

    .payment-text-wrapper {
        display: block;
        text-align: center;
        white-space: nowrap;
        width: 100%;
    }

    .payment-text-top {
        font-weight: 700;
        color: #1c54c9;
        font-size: 4.02vw; /* 430px時約17px相当 */
        text-align: center;
        font-family: 'M PLUS Rounded 1c', sans-serif;
    }

    .payment-text-dot {
        margin-left: -0.7vw;
        margin-right: -0.7vw;
    }

    .payment-text-bottom {
        font-weight: 700;
        color: #1c54c9;
        font-size: 4.02vw; /* 430px時約17px相当 */
        text-align: center;
        width: 100%;
        font-family: 'M PLUS Rounded 1c', sans-serif;
    }

    .cardbrand-image {
        width: 90%;
        max-width: 90%;
        height: auto;
        margin-top: auto;
        margin-bottom: -1.16vw; /* 430px時-5px相当 */
        object-fit: contain;
    }

    .payment-bottom-card {
        background: white;
        width: calc(100% - 2vw);
        height: 23.6vw;
        margin-top: 16.0vw;
        margin-left: 1vw;
        margin-right: 1vw;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1.4vw;
        padding: 0.93vw;
        position: relative;
        z-index: 2;
    }

    .bottom-card-image {
        width: calc(33.333% - 1vw);
        height: 100%;
        object-fit: cover;
        border-radius: 0.47vw;
    }

    .hero-worker {
        position: absolute;
        left: 13.33vw;
        bottom: 17.2vw;
        width: 107.44vw;
        height: 83.57vw;
        z-index: 1;
    }

    .hero-worker img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .achievement-number {
        font-size: 4.65vw;
        font-weight: 900;
        color: #FFD700;
        margin: 0 1.16vw;
        display: block;
        align-items: unset;
        background: linear-gradient(135deg, #87CEEB 0%, #ADD8E6 100%);
    }
    
    .hero-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding: 0 3.49vw;
        text-align: center;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .hero-diagonal-rectangle {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 23.26vw;
        background: var(--primary-color);
        z-index: 1;
        clip-path: polygon(0 30%, 100% 0, 100% 100%, 0 100%);
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .diagonal-text {
        display: flex;
        align-items: flex-end;
        gap: 1.16vw;
        padding-top: 4.65vw;
        font-weight: 700;
        font-style: italic;
        position: relative;
        top: -0.93vw;
    }
    
    .area-text {
        font-size: 5.58vw;
        color: var(--white);
    }
    
    .ha-text {
        font-size: 3.72vw;
        color: var(--white);
        position: relative;
        top: -0.93vw;
    }
    
    .speed-text {
        font-size: 6.98vw;
        color: #FFEB3B;
        font-weight: 900;
        text-shadow:
            0.23vw 0.23vw 0.47vw rgba(0, 0, 0, 0.4),
            0 0 0.23vw rgba(0, 0, 0, 0.5);
        position: relative;
        top: 1.16vw;
    }
    
    .container {
        max-width: 100%;
        padding: 0 3.49vw;
    }

    .hero-title {
        position: relative;
        right: 10vw;
    }

    .hero-title .title-large {
        font-size: 4.65vw;
        display: block;
        position: relative;
        text-align: left;
        bottom: 11.63vw;
    }
    
    .hero-title .title-small {
        font-size: 5.58vw;
        display: block;
        text-align: left;
        width: 100%;
        top: 3.49vw;
        position: relative;
    }
    
    .title-problem,
    .title-etc {
        display: inline;
        margin: 0;
        padding: 0;
        top: 0.93vw; /* 4px / 430 */
    }
    
    .title-trouble {
        display: block;
        line-height: 1.2;
        margin-top: 0vw;
        margin-left: 0vw;
        padding: 0;
        font-size: 10.70vw;
        letter-spacing: -0.05em;
        text-shadow:
            -0.23vw -0.23vw 0 #FFFFFF,
            0.23vw -0.23vw 0 #FFFFFF,
            -0.23vw 0.23vw 0 #FFFFFF,
            0.23vw 0.23vw 0 #FFFFFF,
            0.47vw 0.47vw 0 #FFFFFF,
            -0.47vw -0.47vw 0 #FFFFFF,
            0.47vw -0.47vw 0 #FFFFFF,
            -0.47vw 0.47vw 0 #FFFFFF;
    }
    .trouble-additional {
        margin-left: 1.16vw; /* 5px / 430 */
        top: -1.16vw; /* -5px / 430 */
        text-shadow:
            -0.23vw -0.23vw 0 #FFFFFF,
            0.23vw -0.23vw 0 #FFFFFF,
            -0.23vw 0.23vw 0 #FFFFFF,
            0.23vw 0.23vw 0 #FFFFFF,
            0.47vw 0.47vw 0 #FFFFFF,
            -0.47vw -0.47vw 0 #FFFFFF,
            0.47vw -0.47vw 0 #FFFFFF,
            -0.47vw 0.47vw 0 #FFFFFF;
    }
    @keyframes water-wave {
        0%, 100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-0.70vw); /* -3px / 430 */
        }
    }
    
    .price-start {
        font-size: 18.60vw;
        bottom: 5.58vw;
        text-shadow:
            -0.23vw -0.23vw 0 #FFFFFF,
            0.23vw -0.23vw 0 #FFFFFF,
            -0.23vw 0.23vw 0 #FFFFFF,
            0.23vw 0.23vw 0 #FFFFFF,
            0.47vw 0.47vw 0 #FFFFFF,
            -0.47vw -0.47vw 0 #FFFFFF,
            0.47vw -0.47vw 0 #FFFFFF,
            -0.47vw 0.47vw 0 #FFFFFF;
    }
    .price-start .price-suffix {
        bottom: 6.98vw; /* 30px / 430 */
        left: 1.86vw; /* 8px / 430 */
    }
    .price-start .price-tax {
        margin-bottom: 0.47vw; /* 2px / 430 */
    }
    
    .super-text {
        font-size: 13.02vw;
        display: block;
        text-align: left;
        top: 2.79vw;
    }
    
    .resolve-text {
        display: block;
        text-align: right;
        font-size: 6.98vw;
        margin-top: 0vw;
        padding-right: 0vw;
        color: #F0F8FF;
        font-weight: 700;
        text-shadow:
            0 0 2.33vw rgba(135, 206, 235, 1),
            0 0 4.65vw rgba(135, 206, 235, 0.8),
            0 0 6.98vw rgba(135, 206, 235, 0.6),
            0 0 9.30vw rgba(135, 206, 235, 0.4),
            0 0 11.63vw rgba(135, 206, 235, 0.2);
    }
    
    .emergency-time {
        font-size: 3.72vw;
        display: inline-block;
    }
    
    .bubble-text {
        font-size: 1em;
        position: relative;
        display: inline;
        white-space: nowrap;
        vertical-align: middle;
        margin: 0 0.47vw;
    }
    
    /* 削除 - 新しいtime-highlight定義を使用 */
    
    .speech-bubble {
        transform: skewX(-10deg);
        padding: 0.23vw 0.47vw;
        font-size: 3.49vw;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        border: 0.7vw solid var(--primary-color);
        box-shadow: 0 0.93vw 2.33vw rgba(0, 0, 0, 0.1);
        position: relative;
        top: 2.33vw;
    }

    .speech-bubble::after {
        bottom: -1.86vw;
        left: 6.98vw;
        border-left: 1.86vw solid transparent;
        border-right: 1.86vw solid transparent;
        border-top: 1.86vw solid var(--primary-color);
    }

    .bubble-text {
        font-style: italic;
    }

    .highlight-time {
        font-size: 1.3em;
        color: #FFD700;
        font-weight: 900;
        text-shadow: 0 0 1.16vw rgba(255, 255, 255, 0.8),
                     0 0 2.33vw rgba(255, 255, 255, 0.6),
                     0 0 3.49vw rgba(255, 255, 255, 0.4);
    }
    
    .discount-percent {
        font-size: 8.37vw;
    }

    .discount-off {
        font-size: 3.8vw;
        font-weight: 900;
        background: linear-gradient(45deg, #f01d01 0%, #fb5c17 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        display: inline-block;
        font-stretch: normal;
        font-style: italic;
        transform: scaleX(1.0) scaleY(1.1) translateY(0.2vw);
        transform-origin: center;
        padding-right: 1.86vw;
        margin-left: -0.6vw;
    }

    .achievement-circles {
        gap: 1.40vw;
        z-index: 15;
        position: absolute;
        bottom: 8%;
        left: 50%;
        transform: translateX(-50%);
        justify-content: center;
        width: 100%;
        padding: 0 3.49vw;
        box-sizing: border-box;
    }
    
    .achievement-circle {
        width: 21.40vw;
        height: 21.40vw;
    }
    
    .achievement-main {
        font-size: 3.33vw;
    }
    
    .achievement-main-large {
        font-size: 3.95vw;
    }
    
    .achievement-sub {
        font-size: 2.79vw;
    }
    
    .achievement-container {
        flex-direction: column;
        gap: 6.98vw;
    }
    
    .symptoms-grid {
        display: flex;
        overflow-x: scroll;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        gap: 0; /* gapを0にしてmargin-rightで制御 */
        padding: 1.0vw 4.65vw; /* 左右に余白を追加（430px時20px相当） */
        scrollbar-width: none; /* Firefox用 */
        -ms-overflow-style: none; /* IE/Edge用 */
    }

    /* スクロールバーを非表示（Chrome/Safari用） */
    .symptoms-grid::-webkit-scrollbar {
        display: none;
    }

    .symptom-card {
        flex: 0 0 calc(100% - 9.30vw); /* 1枚分の幅（左右パディング分を引く） */
        scroll-snap-align: center; /* 中央にスナップ */
        margin: 0;
        margin-right: 13.95vw; /* カードの右側に十分なスペースを追加して次のカードを完全に隠す */
        border-radius: 2.33vw;
    }

    .symptom-card:first-child {
        margin-left: 4.65vw; /* 最初のカードのみ左マージンを追加して中央に配置 */
    }

    .symptom-category {
        font-size: 3.26vw;
        padding: 2.33vw;
    }

    .symptom-image {
        height: 40vw;
    }

    .symptom-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .work-time-badge {
        width: 14vw;
        height: 14vw;
        top: 1.86vw;
        right: 1.86vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        padding: 0;
    }

    .badge-label {
        font-size: 2.79vw; /* 430px時12px相当 */
        line-height: 1.2;
    }

    .badge-time {
        font-size: 2.79vw; /* 430px時12px相当 */
    }

    .symptom-content {
        padding: 2.79vw 1.86vw;
    }

    .symptom-title {
        font-size: 4.0vw; /* 430px時18px相当 */
        margin-bottom: 1.86vw;
        line-height: 1.3;
    }

    .price-divider {
        margin: 2.33vw 0;
    }

    .price-display {
        margin-bottom: 1.40vw;
    }

    .price-note {
        font-size: 3.72vw; /* 430px時16px相当 */
    }

    .note-highlight {
        font-size: 5.5vw;
        margin-bottom: 2.33vw;
    }

    .price-note p {
        font-size: 3.72vw; /* 430px時16px相当 */
        margin: 1.16vw 0;
    }

    .price-number {
        font-size: 9.14vw; /* 430px時35px相当 */
    }

    .price-unit {
        font-size: 3.59vw; /* 430px時18px相当 */
    }

    /* 症状カードスライダーの矢印ボタン */
    .symptom-slider-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(255, 255, 255, 0.95);
        border: 0.47vw solid #2196F3; /* 430px時2px相当 */
        border-radius: 50%;
        width: 9.30vw; /* 430px時40px相当 */
        height: 9.30vw;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 6.98vw; /* 430px時30px相当 */
        color: #2196F3;
        cursor: pointer;
        z-index: 10;
        transition: all 0.3s ease;
        box-shadow: 0 0.47vw 1.86vw rgba(0, 0, 0, 0.15);
    }

    .symptom-slider-arrow:hover {
        background: #2196F3;
        color: white;
        box-shadow: 0 0.93vw 2.79vw rgba(33, 150, 243, 0.3);
    }

    .symptom-slider-prev {
        left: 0.93vw; /* 430px時4px相当 */
    }

    .symptom-slider-next {
        right: 0.93vw;
    }

    /* ドットインジケーター */
    .symptom-dots {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1.86vw; /* 430px時8px相当 */
        margin-top: 4.65vw; /* 430px時20px相当 */
        padding-bottom: 2.33vw;
    }

    .symptom-dot {
        width: 2.33vw; /* 430px時10px相当 */
        height: 2.33vw;
        border-radius: 50%;
        background: #D1D5DB;
        border: none;
        cursor: pointer;
        transition: all 0.3s ease;
        padding: 0;
    }

    .symptom-dot.active {
        background: #2196F3;
        width: 6.98vw; /* 430px時30px相当 */
        border-radius: 1.16vw; /* 430px時5px相当 */
    }

    .symptom-dot:hover {
        background: #64B5F6;
    }

    /* スライダーコンテナの位置調整 */
    .symptoms-section .container {
        position: relative;
    }

    .reasons-grid,
    .cases-grid {
        grid-template-columns: 1fr;
        gap: 6.98vw;
    }

    .reason-image img {
        height: 55vw;
    }

    /* モバイル版cases要素のフォントサイズ拡大 */
    .case-type {
        font-size: 4.0vw; /* 430px時18px相当 */
        padding: 1.16vw 2.79vw;
        border-radius: 4.65vw;
    }

    .case-time {
        font-size: 3.95vw; /* 430px時14px相当 */
    }

    .case-header {
        padding: 3.49vw 4.65vw;
    }

    .case-content {
        padding: 6.98vw;
    }

    .price-label {
        font-size: 3.72vw; /* 430px時16px相当 */
    }

    .price-amount {
        font-size: 7.44vw; /* 430px時32px相当 */
    }

    .case-comment {
        font-size: 3.95vw; /* 430px時16px相当 */
        padding-left: 4.65vw;
        margin-bottom: 3.49vw;
    }

    .case-comment::before {
        font-size: 9.30vw; /* 430px時40px相当 */
        top: -2.33vw;
    }

    .case-info {
        font-size: 3.95vw; /* 430px時14px相当 */
    }

    .case-price {
        margin-bottom: 4.65vw;
        padding-bottom: 4.65vw;
        border-bottom: 0.47vw solid var(--gray-medium);
    }

    .flow-section {
        padding-top: 0; /* 上部のマージンを無くす */
        margin-top: 5vw;
    }

    .flow-steps {
        flex-direction: column;
        gap: 1.65vw;
        max-width: 100%;
        width: 100%;
        margin: 0;
        padding: 0 4.65vw;
        box-sizing: border-box;
    }

    .flow-step {
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: 60vw;
        padding: 3.49vw 2.33vw;
        margin: 0;
        box-sizing: border-box;
        border-radius: 0;
    }

    .step-number {
        font-size: 3.72vw;
        padding: 1.16vw 3.49vw;
        border-radius: 4.65vw;
        margin-bottom: 4.65vw;
    }

    .step-icon {
        height: 30vw;
        margin-bottom: 4.65vw;
    }

    .step-icon img {
        width: 45vw;
        height: 30vw;
        border-radius: 0;
        box-shadow: 0 0.93vw 3.49vw rgba(0, 0, 0, 0.1);
    }

    .flow-step h3 {
        font-size: 5.35vw; /* 430px時23px相当 */
        /* margin-bottom: 3.49vw; */
    }

    .flow-step p {
        font-size: 3.95vw; /* 430px時17px相当 */
        padding: 0 5.33vw; /* 430px時0 10px相当 */
        margin: 1.16vw 0 2.33vw 0; /* 430px時5px 0 10px 0相当 */
    }

    .flow-arrow {
        transform: rotate(90deg);
        margin: 0.2vw 0;
        font-size: 6.98vw;
    }

    /* モバイル版FAQ要素のフォントサイズ拡大 */
    .faq-list {
        max-width: 100%;
        padding: 0 4.65vw;
        margin: 0 auto;
        box-sizing: border-box;
    }

    .faq-item {
        margin-bottom: 4.65vw;
        border-radius: 2.33vw;
    }

    .faq-question {
        padding: 4.65vw 6.98vw;
        font-size: 4.19vw; /* 430px時18px相当 */
        font-weight: 700;
    }

    .faq-toggle {
        font-size: 5.58vw; /* 430px時24px相当 */
    }

    .faq-item.active .faq-answer {
        max-height: 46.51vw; /* 430px時200px相当 */
    }

    .faq-answer p {
        padding: 4.65vw 6.98vw;
        font-size: 3.72vw; /* 430px時16px相当 */
        line-height: 1.8;
    }

    /* モバイル版contact-form要素のフォントサイズ拡大 */
    .form-wrapper {
        max-width: 100%;
        margin: 0 4.65vw;
        border-radius: 4.65vw;
    }

    .form-lead {
        font-size: 4.65vw; /* 430px時20px相当 */
        font-weight: 700;
        margin-bottom: 4.65vw;
    }

    .contact-form {
        padding: 9.30vw;
    }

    .form-group label {
        margin-bottom: 1.86vw;
        font-size: 3.72vw; /* 430px時16px相当 */
        font-weight: 700;
    }

    .required {
        font-size: 2.79vw; /* 430px時12px相当 */
        margin-left: 1.16vw;
    }

    .form-group input,
    .form-group textarea {
        padding: 2.79vw 3.49vw;
        border: 0.47vw solid var(--gray-medium);
        border-radius: 1.86vw;
        font-size: 3.72vw; /* 430px時16px相当 */
    }

    .form-group {
        margin-bottom: 4.65vw;
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 4.65vw;
        margin-bottom: 4.65vw;
    }

    .symptom-button span {
        padding: 2.79vw;
        border: 0.47vw solid var(--gray-medium);
        border-radius: 1.86vw;
        font-size: 3.26vw; /* 430px時14px相当 */
        font-weight: 700;
    }

    .submit-button {
        padding: 4.65vw;
        border-radius: 11.63vw;
        font-size: 4.65vw; /* 430px時20px相当 */
        font-weight: 700;
        gap: 2.33vw;
        margin-top: 6.98vw;
    }

    .submit-button:hover {
        transform: translateY(-0.70vw);
        box-shadow: 0 2.33vw 6.98vw rgba(231, 76, 60, 0.3);
    }

    .submit-icon {
        font-size: 5.58vw; /* 430px時24px相当 */
    }

    .form-note {
        margin-top: 4.65vw;
        font-size: 3.26vw; /* 430px時14px相当 */
    }

    .form-phone {
        font-size: 5.58vw; /* 430px時24px相当 */
    }
    
    .symptom-buttons {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* モバイル版 フッターセクション（px→vw変換） */
    .footer {
        padding: 13.95vw 0 0; /* 60px / 430 */
    }
    .footer-container {
        max-width: 100%; /* モバイルでは全幅 */
        padding: 0 9.30vw; /* 40px / 430 */
    }
    .footer-main-content {
        grid-template-columns: 1fr; /* モバイルでは1カラム */
        gap: 13.95vw; /* 60px / 430 */
        margin-bottom: 9.30vw; /* 40px / 430 */
    }
    .footer-section-title {
        font-size: 4.19vw; /* 18px / 430 */
        margin-bottom: 4.65vw; /* 20px / 430 */
        padding-bottom: 2.33vw; /* 10px / 430 */
        border-bottom: 0.47vw solid #e0e0e0; /* 2px / 430 */
    }
    .footer-table tr {
        border-bottom: 0.23vw solid #e0e0e0; /* 1px / 430 */
    }
    .footer-table th {
        width: 27.91vw; /* 120px / 430 */
        padding: 3.72vw 2.79vw; /* 16px 12px / 430 */
        font-size: 3.26vw; /* 14px / 430 */
    }
    .footer-table td {
        padding: 3.72vw 2.79vw; /* 16px 12px / 430 */
        font-size: 3.26vw; /* 14px / 430 */
    }
    .footer-locations {
        gap: 5.58vw; /* 24px / 430 */
    }
    .footer-location {
        padding: 4.65vw; /* 20px / 430 */
        border-radius: 1.86vw; /* 8px / 430 */
        border: 0.23vw solid #e0e0e0; /* 1px / 430 */
    }
    .location-name {
        font-size: 3.72vw; /* 16px / 430 */
        padding: 1.86vw 3.72vw; /* 8px 16px / 430 */
        margin: -4.65vw -4.65vw 2.79vw -4.65vw; /* -20px -20px 12px -20px / 430 */
        border-radius: 1.86vw 1.86vw 0 0; /* 8px 8px 0 0 / 430 */
    }
    .location-postal {
        font-size: 3.26vw; /* 14px / 430 */
        margin-bottom: 0.93vw; /* 4px / 430 */
    }
    .location-address {
        font-size: 3.26vw; /* 14px / 430 */
    }
    .footer-bottom {
        padding: 5.58vw 0; /* 24px / 430 */
        border-top: 0.23vw solid #e0e0e0; /* 1px / 430 */
        font-size: 2.79vw; /* 12px / 430 */
    }

    .footer-bubble {
        font-size: 3.26vw;
        padding: 1.40vw 3.72vw;
    }

    .fixed-footer-background {
        padding: 2.5vw 6.0vw 2.5vw;
    }

    .fixed-footer-content {
        padding: 0;
        gap: 0;
        border-radius: 999vw;
        box-shadow: 0 1.5vw 4.0vw rgba(0, 0, 0, 0.3);
        position: relative;
    }

    .footer-top-text {
        font-size: 3.2vw;
        padding: 0.5vw 4.0vw 0;
        margin-bottom: -1.4vw;
        position: relative;
        top: 1.3vw;
        -webkit-text-stroke: 0.28vw white;
        text-stroke: 0.28vw white;
        paint-order: stroke fill;
    }

    .footer-phone-container {
        gap: 1.6vw;
        padding: 0 4.0vw 0 4.0vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .footer-phone-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .footer-phone-icon {
        width: 9.5vw;
        height: 9.5vw;
        position: absolute;
        left: 5.5vw;
        top: 39%;
        transform: translateY(-50%);
        z-index: 10;
    }

    .footer-phone-number {
        font-size: 8.3vw;
        letter-spacing: 0.1vw;
        -webkit-text-stroke: 0.40vw white;
        text-stroke: 0.40vw white;
        paint-order: stroke fill;
        transform: scaleY(1.1);
    }

    .footer-finger-icon {
        width: 12.0vw;
        position: absolute;
        right: 1.0vw;
        bottom: 2.0vw;
        z-index: 10;
    }

    .footer-bottom-text {
        font-size: 3.2vw;
        padding: 0.5vw 4.0vw 0.5vw 4.0vw;
        margin: -2.2vw 12.0vw 0.6vw 12.0vw;
        border-radius: 5.0vw;
    }
    
    .phone-label {
        display: none;
    }
    
    .phone-num {
        font-size: 5.58vw;
    }
    
    .hero-cta-area {
        flex-direction: column;
        gap: 4.65vw;
        margin-top: 6.98vw;
        margin-bottom: 9.30vw;
    }
    
    .cta-phone {
        padding: 2.5vw 4.65vw 3.5vw 4.65vw;
        font-size: 3.72vw;
        margin: 0 4.65vw;
        width: calc(100% - 9.30vw);
        justify-content: center;
        background-color: #FFE000;
        color: #000;
        overflow: visible;
        border-radius: 999vw;
    }

    .cta-text {
        align-items: center;
        margin-bottom: 0.5vw;
        margin-left: 0;
        text-align: center;
    }

    .cta-large {
        font-size: 8.3vw;
        transform: scaleY(1.1);
        line-height: 1;
        letter-spacing: 0.1vw;
        -webkit-text-stroke: 0.35vw white;
        text-stroke: 0.35vw white;
        paint-order: stroke fill;
    }

    .safety-badges {
        gap: 2.33vw;
        margin-top: 3.49vw;
    }

    .badge {
        font-size: 2.79vw;
        padding: 1.40vw 3.49vw;
    }

    /* CTA Bar - モバイル版アスペクト比維持 */
    .cta-bar {
        width: 100%;
        height: 0;
        padding: 0;
        padding-top: calc(100 / 430 * 100%) ; /* 35.35% */
        position: relative;
        overflow: hidden;
        background-color: #2B5BA6;
    }

    .cta-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2vw;
        max-width: none;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        overflow: hidden;
    }

    .cta-small {
        font-size: 3.26vw; /* 430px時14px相当 */
        opacity: 1;
    }

    .cta-free {
        color: #FF0000;
        -webkit-text-stroke: 0.28vw white;
        text-stroke: 0.28vw white;
        paint-order: stroke fill;
    }

    .cta-time {
        -webkit-text-stroke: 0.20vw white;
        text-stroke: 0.20vw white;
        paint-order: stroke fill;
    }

    .cta-icon {
        width: 5.5vw; /* 元のサイズの1/20 */
        height: auto;
        filter: brightness(0);
    }

    .cta-phone .cta-icon {
        width: 9.5vw;
        height: 9.5vw;
        position: absolute;
        left: 4vw;
        top: 50%;
        transform: translateY(-50%);
    }

    .cta-arrow {
        width: 21.0vw;
        height: auto;
        position: absolute;
        right: -5.4vw;
        top: 45%;
        transform: translateY(-50%);
        animation: none;
    }

    /* 取り扱いメーカーのご紹介セクション - モバイル版 */
    .makers-section {
        padding: 0;
        margin-top: 5vw;
        background: var(--white);
    }

    .makers-header {
        background: #FFF9C4;
        padding: 4.65vw 0; /* 430px時20px相当 */
        text-align: center;
    }

    .makers-title {
        font-size: 5.58vw; /* 430px時24px相当 */
        font-weight: 900;
        color: #FF6F00;
        margin: 0;
    }

    .makers-content {
        padding: 3.49vw 0; /* 430px時15px 0相当 */
        max-width: 100%;
        margin: 0 1.16vw; /* 430px時0 5px相当 */
    }

    .makers-description {
        font-size: 4.0vw; /* 430px時17px相当 */
        line-height: 1.8;
        margin-bottom: 4.65vw; /* 430px時20px相当 */
        text-align: left;
        padding: 0 2.33vw; /* 430px時0 10px相当 */
    }

    .makers-box {
        background: var(--white);
        border: 0.47vw solid #1976D2; /* 430px時2px相当 */
        border-radius: 2.33vw; /* 430px時10px相当 */
        padding: 2.33vw; /* 430px時10px相当 */
        margin-bottom: 4.65vw; /* 430px時20px相当 */
    }

    .makers-box-title {
        background: #1976D2;
        color: var(--white);
        font-size: 4.65vw; /* 430px時20px相当 */
        font-weight: 900;
        padding: 2.33vw 4.65vw; /* 430px時10px 20px相当 */
        margin: -2.33vw -2.33vw 2.33vw -2.33vw; /* 430px時-10px -10px 10px -10px相当 */
        border-radius: 1.86vw 1.86vw 0 0; /* 430px時8px 8px 0 0相当 */
        text-align: center;
    }

    .makers-list {
        font-size: 4.65vw; /* 430px時20px相当 */
        line-height: 1.8;
        margin: 0;
        text-align: center;
        font-weight: 700;
        word-wrap: break-word;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .makers-note {
        font-size: 3.72vw; /* 430px時16px相当 */
        line-height: 1.6;
        text-align: center;
        margin: 0;
    }

    /* 対応エリアセクション - モバイル版 */
    .area-section {
        padding: 0;
        background: var(--white);
    }

    .area-header {
        background: #FFF9C4;
        padding: 4.65vw 0; /* 430px時20px相当 */
        text-align: center;
    }

    .area-title {
        font-size: 5.58vw; /* 430px時24px相当 */
        font-weight: 900;
        color: #FF6F00;
        margin: 0;
    }

    .area-content {
        padding: 3.49vw 0; /* 430px時30px 0相当 */
    }

    .area-description {
        font-size: 4.0vw; /* 430px時17px相当 */
        line-height: 1.8;
        margin-bottom: 4.65vw; /* 430px時20px相当 */
        text-align: left;
    }

    .area-note {
        display: block;
        font-size: 3.26vw; /* 430px時14px相当 */
        margin-top: 2.33vw; /* 430px時10px相当 */
    }

    .area-map {
        text-align: center;
        margin-top: 4.65vw; /* 430px時20px相当 */
    }

    .japan-map-image {
        max-width: 80%;
        height: auto;
    }

    /* WEBキャンペーン情報セクション - モバイル版 */
    .campaign-section {
        padding: 13.95vw 0; /* 430px時60px相当 */
        background:
            linear-gradient(to bottom, white 0, white 12vw, transparent 12vw),
            linear-gradient(to top, white 0, white 9vw, transparent 9vw),
            repeating-linear-gradient(
                90deg,
                #ffe95e 0,
                #ffe95e 4.65vw, /* 20px / 430 */
                #ffee8c 4.65vw, /* 20px / 430 */
                #ffee8c 9.30vw  /* 40px / 430 */
            );
        position: relative;
        overflow: hidden;
    }

    .campaign-section::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 120%;
        height: 120%;
        background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, rgba(255, 238, 140, 0) 70%);
        pointer-events: none;
    }

    .campaign-container {
        max-width: 100%;
        margin: -7.3vw auto 0; /* 430px時-30px相当 */
        padding: 0 4.65vw; /* 430px時20px相当 */
        position: relative;
        z-index: 1;
        text-align: center;
    }

    .campaign-ribbon {
        position: relative;
        margin: 0 auto 6.98vw; /* 430px時30px相当 */
        width: 100%;
        max-width: 90%;
    }

    .ribbon-image {
        width: 100%;
        height: auto;
        display: block;
    }

    .ribbon-text {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 6.51vw; /* 430px時28px相当 */
        font-weight: 900;
        color: #ffffff;
        text-shadow: 0.47vw 0.47vw 0.93vw rgba(0, 0, 0, 0.3); /* 430px時2px 2px 4px相当 */
        white-space: nowrap;
        letter-spacing: 0.47vw; /* 430px時2px相当 */
    }

    .campaign-content {
        margin-top: 4.65vw; /* 430px時20px相当 */
    }

    .campaign-description {
        position: relative;
        display: inline-block;
        font-size: 4.65vw; /* 430px時20px相当 */
        font-weight: 700;
        margin: 0 0 3.49vw 0; /* 430px時15px相当 */
        line-height: 1.6;
    }

    .campaign-description-stroke-layer {
        position: relative;
        display: inline;
        color: #9E9E9E;
        -webkit-text-stroke: 0.93vw white; /* 430px時4px相当 */
        z-index: 1;
    }

    .campaign-description-text-layer {
        position: absolute;
        top: 0;
        left: 0;
        display: inline;
        color: #1a1a1a;
        z-index: 2;
    }

    .campaign-label {
        font-size: 5.58vw; /* 430px時24px相当 */
        font-weight: 700;
        color: #C62828;
        margin: 2.33vw 0 1.16vw 0; /* 430px時10px 0 5px 0相当 */
    }

    .campaign-discount {
        position: relative;
        display: inline-block;
        margin: 2.33vw 0; /* 430px時10px相当 */
        margin-left: -1.4vw;
    }

    .campaign-discount-stroke-layer {
        position: relative;
        display: inline;
        white-space: nowrap;
        z-index: 1;
    }

    .campaign-discount-gradient-layer {
        position: absolute;
        top: 0;
        left: 0;
        display: inline;
        white-space: nowrap;
        z-index: 2;
    }

    .campaign-price-stroke,
    .campaign-price {
        font-size: 16.28vw; /* 430px時70px相当 */
        font-weight: 900;
        line-height: 1;
        font-family: 'Noto Sans JP', sans-serif;
        display: inline-block;
        vertical-align: middle;
        letter-spacing: -0.47vw; /* 430px時-2px相当 */
    }

    .campaign-price-stroke {
        color: #9E9E9E;
        -webkit-text-stroke: 0.93vw white; /* 430px時4px相当 */
        padding-right: 0.70vw; /* 430px時3px相当 */
    }

    .campaign-price {
        color: #C62828;
        padding-right: 0.70vw; /* 430px時3px相当 */
    }

    .campaign-price-sub-stroke,
    .campaign-price-sub {
        display: inline-block;
        vertical-align: middle;
        margin-top: 0.50vw;
    }

    .campaign-tax-stroke,
    .campaign-tax {
        font-size: 3.26vw; /* 430px時14px相当 */
        font-weight: 700;
        line-height: 1;
        font-family: 'Noto Sans JP', sans-serif;
        display: block;
    }

    .campaign-tax-stroke {
        color: #9E9E9E;
        -webkit-text-stroke: 0.93vw white; /* 430px時4px相当 */
        padding-right: 0.70vw; /* 430px時3px相当 */
    }

    .campaign-tax {
        color: #C62828;
        padding-right: 0.70vw; /* 430px時3px相当 */
    }

    .campaign-unit-stroke,
    .campaign-unit {
        font-size: 8.94vw; /* 430px時32px相当 */
        font-weight: 900;
        line-height: 1;
        font-family: 'Noto Sans JP', sans-serif;
        display: block;
    }

    .campaign-unit-stroke {
        color: #9E9E9E;
        -webkit-text-stroke: 0.93vw white; /* 430px時4px相当 */
        padding-right: 0.70vw; /* 430px時3px相当 */
        margin-top: 0.70vw;
    }

    .campaign-unit {
        color: #C62828;
        padding-right: 0.70vw; /* 430px時3px相当 */
        margin-top: 0.70vw;
    }

    .campaign-off-stroke,
    .campaign-off {
        font-size: 15.52vw; /* 430px時56px相当 */
        font-weight: 900;
        line-height: 1;
        font-family: 'Noto Sans JP', sans-serif;
        display: inline-block;
        vertical-align: middle;
        letter-spacing: -0.47vw; /* 430px時-2px相当 */
    }

    .campaign-off-stroke {
        color: #9E9E9E;
        -webkit-text-stroke: 0.93vw white; /* 430px時4px相当 */
    }

    .campaign-off {
        color: #C62828;
        padding-right: 0.70vw; /* 430px時3px相当 */
    }

    /* モバイル版 セクション共通スタイル（px→vw変換） */
    section {
        padding: 18.60vw 0; /* 430px時80px相当 */
    }

    /* FAQセクションは上部パディングなし */
    .faq-section {
        padding-top: 5vw;
    }

    .cases-section {
        padding-bottom: 2vw;
    }

    .title-ja {
        font-size: 8.37vw; /* 430px時36px相当 */
    }

    .cases-section .title-ja {
        font-size: 8.51vw; /* 430px時36.6px相当 */
    }

    /* モバイル版 5つの理由セクション（px→vw変換） */
    .reason-count {
        font-size: 9.77vw; /* 430px時42px相当 */
    }
    .five-reasons-grid {
        gap: 6.98vw; /* 430px時30px相当 */
        margin-bottom: 6.98vw; /* 430px時30px相当 */
    }
    .five-reason-item {
        border-radius: 4.65vw; /* 430px時20px相当 */
        box-shadow: 0 1.86vw 5.81vw rgba(0, 0, 0, 0.1); /* 430px時8px 25px相当 */
    }
    .five-reason-item:hover {
        transform: translateY(-2.33vw); /* 430px時-10px相当 */
        box-shadow: 0 3.49vw 9.30vw rgba(0, 0, 0, 0.15); /* 430px時15px 40px相当 */
    }
    .reason-header {
        padding: 3.49vw 4.65vw; /* 430px時15px 20px相当 */
    }
    .reason-label {
        font-size: 2.79vw; /* 430px時12px相当 */
        letter-spacing: 0.23vw; /* 430px時1px相当 */
    }
    .reason-number {
        font-size: 5.58vw; /* 430px時24px相当 */
    }
    .reason-title {
        padding: 4.65vw 5.81vw 4.65vw; /* 430px時20px 25px 20px相当 */
        font-size: 5.35vw; /* 430px時23px相当 */
    }
    .sub-title {
        font-size: 3.95vw; /* 430px時17px相当 */
        margin-top: 1.16vw; /* 430px時5px相当 */
    }
    .reason-image {
        padding: 0 5.81vw; /* 430px時25px相当 */
        margin-bottom: 4.65vw; /* 430px時20px相当 */
    }
    .reason-image img {
        border-radius: 3.49vw; /* 430px時15px相当 */
        box-shadow: 0 0.93vw 3.49vw rgba(0, 0, 0, 0.1); /* 430px時4px 15px相当 */
    }
    .reason-description {
        padding: 0 5.81vw 6.98vw; /* 430px時25px 30px相当 */
        font-size: 3.95vw; /* 430px時17px相当 */
    }

    /* モバイル版section-titleの余白をvw単位に調整 */
    .section-title {
        margin-top: 0vw; /* 430px時40px相当 */
        margin-bottom: 5.95vw; /* 430px時60px相当 */
    }

    /* achievement-stat elements - モバイル版フォントサイズ拡大 */
    .achievement-stat {
        padding: 2.33vw 4.65vw;
        gap: 1.16vw;
        margin-bottom: 4.65vw;
        border-radius: 7.44vw;
        text-align: center;
    }

    .stat-text {
        font-size: 3.72vw;
        font-weight: 700;
        line-height: 1.4;
    }

    .stat-number {
        font-size: 5.58vw;
        font-weight: 900;
        color: var(--primary-color);
    }

    .stat-unit {
        font-size: 4.19vw;
        font-weight: 700;
        color: var(--secondary-color);
    }
}

/* ========================================
   メニューボタン・メニューパネル
   ======================================== */

/* メニューボタン（PC版） */
.menu-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: white;
    border: none;
    cursor: pointer;
    padding: 0.5vw 1.5vw;
    gap: 0.3vw;
    transition: background-color 0.3s ease;
}

.menu-button:hover {
    background-color: #f5f5f5;
}

.menu-icon {
    display: flex;
    flex-direction: column;
    gap: 0.25vw;
}

.menu-icon span {
    display: block;
    width: 1.5vw;
    height: 0.15vw;
    background-color: #1c54c9;
    border-radius: 0.1vw;
}

.menu-text {
    font-size: 0.7vw;
    font-weight: 700;
    color: #1c54c9;
    font-family: 'Noto Sans JP', sans-serif;
}

/* メニューオーバーレイ */
.menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* メニューパネル */
.menu-panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 25vw;
    max-width: 400px;
    height: 100%;
    background: linear-gradient(135deg, #2E86DE 0%, #3498DB 100%);
    box-shadow: -0.21vw 0 1.05vw rgba(0, 0, 0, 0.3);
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
}

.menu-overlay.active .menu-panel {
    transform: translateX(0);
}

/* メニュー閉じるボタン */
.menu-close {
    position: absolute;
    top: 1.5vw;
    right: 1.5vw;
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3vw;
    padding: 0.5vw;
    color: white;
    font-size: 0.8vw;
    font-weight: 700;
    transition: opacity 0.3s ease;
}

.menu-close:hover {
    opacity: 0.8;
}

/* メニューコンテンツ */
.menu-content {
    padding: 3.5vw 1.5vw 1.5vw;
}

.menu-description {
    color: white;
    font-size: 0.9vw;
    line-height: 1.6;
    margin-bottom: 2vw;
}

/* サービス案内 */
.menu-services-title {
    display: flex;
    align-items: center;
    gap: 0.5vw;
    color: white;
    font-size: 1.1vw;
    font-weight: 700;
    margin-bottom: 1.5vw;
}

/* カテゴリー */
.menu-category {
    margin-bottom: 1.5vw;
}

.menu-category-title {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    font-size: 0.95vw;
    font-weight: 700;
    padding: 0.7vw 1vw;
    margin-bottom: 0;
}

.menu-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-items li {
    background: white;
    border-bottom: 0.05vw solid #e0e0e0;
}

.menu-items li:last-child {
    border-bottom: none;
}

.menu-items a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1vw 1.2vw;
    color: #333;
    text-decoration: none;
    font-size: 0.85vw;
    transition: background-color 0.3s ease;
}

.menu-items a:hover {
    background-color: #f5f5f5;
}

.menu-items a::after {
    content: '›';
    font-size: 1.2vw;
    color: #999;
}

/* モバイル版 */
@media (max-width: 768px) {
    /* メニューボタン */
    .menu-button {
        padding: 2vw 3vw;
        gap: 1vw;
    }

    .menu-icon {
        gap: 1.2vw;
    }

    .menu-icon span {
        width: 6vw;
        height: 0.6vw;
        border-radius: 0.3vw;
    }

    .menu-text {
        font-size: 2.8vw;
    }

    /* メニューパネル */
    .menu-panel {
        width: 85vw;
        max-width: none;
    }

    /* メニュー閉じるボタン */
    .menu-close {
        top: 4vw;
        right: 4vw;
        gap: 1vw;
        padding: 2vw;
        font-size: 3vw;
    }

    .menu-close svg {
        width: 6vw;
        height: 6vw;
    }

    /* メニューコンテンツ */
    .menu-content {
        padding: 15vw 4vw 4vw;
    }

    .menu-description {
        font-size: 3.5vw;
        margin-bottom: 6vw;
    }

    /* サービス案内 */
    .menu-services-title {
        gap: 2vw;
        font-size: 4.5vw;
        margin-bottom: 4vw;
    }

    .menu-services-title svg {
        width: 5vw;
        height: 5vw;
    }

    /* カテゴリー */
    .menu-category {
        margin-bottom: 4vw;
    }

    .menu-category-title {
        font-size: 3.7vw;
        padding: 2.5vw 3.5vw;
    }

    .menu-items a {
        padding: 3.5vw 4vw;
        font-size: 3.5vw;
    }

    .menu-items a::after {
        font-size: 5vw;
    }
}


/* トイレのつまりページ: モバイル版service-titleの位置調整 */
@media (max-width: 768px) {
    .service-title {
        margin-left: -12vw;
    }
}

/* モバイル版: スピード解決！のフォントサイズをservice-titleと同じに */
@media (max-width: 768px) {
    .hero-subtitle-left .hero-main-large {
        font-size: 11.0vw;
    }
}

/* モバイル版: 固定フッターを常に表示 */
@media (max-width: 768px) {
    .fixed-footer {
        bottom: -0.23vw; /* -1px / 430 */
        opacity: 1 !important;
        visibility: visible !important;
    }
}