@charset "UTF-8";

/* ==========================================================================
変数とリセット
========================================================================== */

/* ==========================================================================
ユーティリティと共通
========================================================================== */
html {
    scroll-padding-top: 90px;
}

/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {

    .btn-primary,
    .btn-more {
        padding: 15px 20px;
    }

    .section-header {
        margin-bottom: 5vw;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .sp_br {
        display: block;
    }

    .section-header {
        margin-bottom: 0;
    }

    .section-header-story {
        margin-bottom: 10vw;
    }

    .section-title {
        margin-bottom: 5vw;
        font-size: max(4.8vw, 24px);
    }

    .section-desc {
        font-size: max(16px, 3.2vw);
    }

    .pc-only {
        display: none;
    }

    .editorial-header-v2 {
        flex-direction: column;
        gap: 20px;
    }

    .header-pillar {
        width: 100px;
        height: 2px;
        margin-top: 0;
    }

    .editorial-header-v2 .section-title {
        margin-bottom: 5vw;
        font-size: 29px;
    }

    .editorial-header-v2 .header-tag {
        font-size: max(3vw, 13px);
        margin-bottom: 3vw;
    }

    .editorial-header-v2 .section-desc {
        font-size: max(3.4vw, 16px);
        text-align: left;
    }

    .filter-nav {
        gap: 10px;
    }

    .filter-item {
        width: calc(25% - 10px * 3 /4);
        min-width: 140px;
    }
}

/* ==========================================================================
ヘッダー
========================================================================== */
/* Media Query: max-width: 1400px */
@media (max-width: 1450px) {
    .header-inner {
        flex-direction: column;
        height: auto;
        padding: 20px 20px;
    }

    .logo {
        margin-bottom: 10px;
        justify-content: center;
    }

    .nav-list {
        gap: 20px;
        height: auto;
    }

    .nav-item a {
        font-size: 13px;
    }

    .sub-page-header {
        margin-top: 133px;
    }
}

/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .header-inner {
        flex-direction: row;
        justify-content: space-between;
        height: 80px;
        padding: 0 20px;
    }

    .sub-page-header {
        padding: 16px 0 34px;
        margin-top: 80px;
    }

    .logo {
        margin-bottom: 0;
    }

    .nav {
        position: fixed;
        top: 80px;
        left: auto;
        right: 0;
        width: 100%;
        max-width: 500px;
        height: calc(100vh - 80px);
        background-color: #fff;
        z-index: 1000;
        display: block;
        opacity: 0;
        visibility: hidden;
        transition: var(--transition);
        overflow-y: auto;
        padding: 40px 20px;
        box-shadow: -10px 0 30px rgba(0, 0, 0, 0.05);
    }

    .page-top .header:not(.scrolled) .nav {
        top: 0;
        height: 100vh;
    }

    .nav.active {
        opacity: 1;
        visibility: visible;
    }

    .nav-list {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        width: 100%;
    }

    .nav-item {
        width: 100%;
        border-bottom: 1px solid #eee;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
    }

    .nav .nav-item a {
        display: block;
        padding: 20px 0;
        font-size: 16px;
        width: 70%;
        transition: var(--transition);
        color: var(--color-text);
    }

    .page-top .nav .nav-item a {
        color: var(--color-text);
        text-shadow: none;
    }

    .nav-item a:hover {
        color: var(--color-accent);
        opacity: 1;
    }

    .header .nav-list .nav-item.has-dropdown>a::after {
        display: none;
    }

    .header .nav-list .nav-item.has-dropdown:hover .dropdown-menu {
        transform: none;
    }

    .nav-item.has-dropdown::after {
        content: "▼";
        position: absolute;
        right: 20px;
        top: 24px;
        font-size: 10px;
        color: #999;
        transition: transform 0.3s ease;
        pointer-events: none;
        z-index: 5;
    }

    .nav-item.has-dropdown.is-open::after {
        transform: rotate(180deg);
        color: var(--color-accent);
    }

    .header .nav-list .nav-item .dropdown-menu {
        position: static;
        width: 100%;
        min-width: 100%;
        transform: none;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        display: none;
        padding: 0 0 20px 30px;
        background-color: #fcfcfc;
        border-top: 1px solid #f0f0f0;
        transition: none;
        left: 0;
    }

    .header .nav-list .nav-item.has-dropdown.is-open .dropdown-menu {
        display: block;
    }

    .header .nav-list .nav-item .dropdown-menu li a {
        padding: 12px 0;
        font-size: 16px;
        color: var(--color-text);
        border-bottom: none;
        opacity: 1;
        text-align: left;
    }

    .header .nav-list .nav-item .dropdown-menu li a:hover {
        color: var(--color-accent);
        background-color: transparent;
    }

    .nav-item.btn-contact {
        margin-left: 0;
        margin-top: 30px;
        border-bottom: none;
    }

    .nav-item.btn-contact a {
        text-align: center;
        margin: 0 auto;
        max-width: 280px;
    }

    .hamburger {
        display: block;
        width: 30px;
        height: 24px;
        position: relative;
        cursor: pointer;
        z-index: 1001;
    }

    .hamburger span {
        display: block;
        position: absolute;
        width: 100%;
        height: 2px;
        background-color: var(--color-text);
        transition: var(--transition);
    }

    .page-top .hamburger span {
        background-color: #fff;
    }

    .hamburger.active span {
        background-color: var(--color-text);
    }

    .header.scrolled .hamburger span {
        background-color: var(--color-text);
    }

    .hamburger span:nth-child(1) {
        top: 0;
    }

    .hamburger span:nth-child(2) {
        top: 11px;
    }

    .hamburger span:nth-child(3) {
        top: 22px;
    }

    .hamburger.active span:nth-child(1) {
        top: 11px;
        transform: rotate(45deg);
    }

    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active span:nth-child(3) {
        top: 11px;
        transform: rotate(-45deg);
    }
}

@media (max-width: 480px) {
    .header-inner {
        padding: 0 10px;
    }

    .logo {
        max-width: 260px;
    }
}

/* ==========================================================================
フッター
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .footer-inner {
        flex-direction: column;
        gap: 60px;
        align-items: center;
        text-align: center;
    }

    .footer-logo {
        flex: 0 0 auto;
        width: 80%;
        max-width: 340px;
        margin-bottom: 20px;
    }

    .footer-sns {
        justify-content: center;
    }

    .footer-links {
        width: 100%;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {

    .footer-banners {
        padding: 30px 0;
    }

    .banners-grid {
        gap: 20px;
    }

    .banner-item img {
        height: 60px;
    }

    /* Footer (Existing) */
    .footer {
        padding-bottom: 70px;
        padding-top: 70px;
    }

    .footer-inner {
        flex-direction: column;
        gap: 40px;
    }

    .footer-links {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .footer-logo h2 {
        margin-bottom: 0.5em;
    }

    .footer-col h4 {
        display: inline-block;
        text-align: left;
    }
}

/* Media Query: max-width: 520px */
@media (max-width: 520px) {
    .footer-logo {
        width: 100%;
    }

    .footer-col {
        text-align: left;
    }

    .footer-col h4::after {
        display: none;
    }

    .footer-col h4 {
        display: block;
        margin-bottom: 15px;
    }
}


/* ==========================================================================
トップメインビジュアル（スライダー）
========================================================================== */
/* Media Query: max-width: 992px */
@media (max-width: 992px) {
    .top-hero.pattern-c {
        flex-direction: column;
        height: 70vh;
    }

    .top-hero-slider-wrap {
        width: 100%;
    }

    .top-hero-elegant-seal {
        position: static;
        transform: rotate(0);
    }

    /* GX Comparison Cards */
    .az-zeh-gx-grid {
        grid-template-columns: 1fr;
        gap: 30px;
        max-width: 600px;
        margin: 0 auto 50px;
    }

    .az-zeh-gx-card-highlight{
        order: -1;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .seal-text {
        font-size: max(8px, 3vw);
    }
}

@media (max-width: 480px) {
    .top-hero.pattern-c {
        height: calc(100vh - 100px);
        min-height: auto;
    }
}

/* ==========================================================================
トップ目的ナビゲーション（section.top-purpose）
========================================================================== */
/* Media Query: max-width: 1200px */
@media (max-width: 1200px) {
    .top-purpose {
        padding-top: 5vw;
        padding-bottom: 6vw;
    }

    .top-purpose-grid {
        width: 60%;
        gap: 10px;
    }

    .top-purpose-content-wrapper {
        gap: 5%;
    }

    .top-purpose-item {
        width: 100%;
        aspect-ratio: 4/1;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .top-purpose-grid {
        flex-wrap: wrap;
        gap: 10px;
        width: 100%;
    }

    .top-purpose-content-wrapper {
        flex-direction: column-reverse;
        row-gap: 5vw;
    }

    .top-purpose-item {
        max-height: 200px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .top-purpose-item:nth-child(2n) {
        border-right: none;
    }

    .top-purpose-jp {
        font-size: max(12px, 2.2vw);
    }

    .top-purpose-en {
        margin-bottom: 0;
        font-size: max(20px, 4vw);
    }

    .top-purpose-text {
        font-size: max(16px, 3.2vw);
    }

    .top-purpose-arrow {
        display: none;
    }
}

@media (max-width: 480px) {
    .top-purpose {
        padding-top: 16vw;
    }
}

/* ==========================================================================
トップニュース（.top-news）
========================================================================== */
@media (max-width: 1024px) {
    .top-news-grid {
        grid-template-columns: 1fr 1fr;
    }

    .news-main {
        grid-column: 1 / 3;
        grid-row: auto;
    }

    .top-news-date {
        font-size: max(2.2vw, 12px);
    }

}

@media (max-width: 768px) {
    .top-news {
        padding: 60px 0;
    }

    .top-news-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .top-news-meta {
        font-size: max(12px, 2.2vw);
    }

    .news-main {
        grid-column: auto;
    }

    .news-main .top-news-content {
        padding: 20px;
    }

    .news-main .top-news-title,
    .news-sub .top-news-title {
        font-size: max(3.8vw, 17px);
    }

    .top-news-desc {
        font-size: max(16px, 3.2vw);
    }
}

/* ==========================================================================
トップコンセプト（.top-concept）
========================================================================== */
/* Media Query: max-width: 1200px */
@media (max-width: 1200px) {
    .top-concept-content {
        margin: 0 auto;
        width: 100%;
        max-width: 740px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .top-concept {
        padding: 10vw 0;
    }

    .top-concept-inner {
        display: block;
    }

    .top-concept-main-title {
        margin-bottom: 0;
        font-size: max(4.8vw, 24px);
    }

    .top-concept-image {
        position: static;
    }

    .top-concept-bg-text {
        font-size: 40vw;
        top: 20%;
    }

    .top-concept-body .text {
        font-size: max(16px, 3.2vw);
    }

    .top-concept-content {
        width: 90%;
        max-width: none;
        margin-top: 0;
        padding: 6vw 5vw 5vw;
        z-index: 3;
    }

    .top-concept-header {
        margin-left: 0;
        margin-bottom: 3vw;
        flex-direction: column;
    }

    .top-concept-title {
        font-size: max(5vw, 24px);
    }

    .top-concept-sub-image {
        display: none;
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
        margin-top: 20px;
        box-shadow: 10px 10px 0 rgba(130, 174, 197, 0.2);
    }

    .top-concept-body {
        padding: 0;
    }

    .top-concept-image {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
    }
}


/* ==========================================================================
トップ施工事例（.top-works）
========================================================================== */
/* Media Query: max-width: 1200px */
@media (max-width: 1200px) {
    .top-works-portfolio-full {
        grid-template-columns: repeat(3, 1fr);
    }

    .top-work-card.logo {
        display: none;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .top-works {
        padding: 8vw 0;
    }

    .top-works .section-header {
        padding: 0 20px;
        margin-bottom: 30px;
    }

    .top-works-portfolio-full {
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
        padding: 0 5%;
    }

    .top-work-card.logo {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .top-work-details {
        padding: 20px 10px;
    }

    .top-work-name {
        font-size: max(16px, 3.2vw);
    }

    .btn-area-right {
        margin-top: 6vw;
    }

    .scroll-hint-wrap {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 700;
        color: var(--color-accent-orange);
        letter-spacing: 0.1em;
        padding-left: 20px;
        margin-top: -35px;
        margin-bottom: 25px;
    }

    .scroll-hint-arrow {
        animation: hintArrow 1.5s infinite;
        display: inline-block;
    }

    @keyframes hintArrow {

        0%,
        100% {
            transform: translateX(0);
            opacity: 0.5;
        }

        50% {
            transform: translateX(5px);
            opacity: 1;
        }
    }

    .top-works-portfolio-full {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 15px;
        padding: 0 20px 40px;
        margin-bottom: 20px;
    }

    /* スクロールバー非表示 */
    .top-works-portfolio-full::-webkit-scrollbar {
        height: 0;
        display: none;
    }

    .top-work-card {
        flex: 0 0 85%;
        scroll-snap-align: center;
    }

    .top-work-name {
        font-size: max(16px, 3.2vw);
    }
}

/* ==========================================================================
TOPブログ
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .top-blog .section-title {
        font-size: 32px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .top-blog {
        padding: 8vw 0;
    }

    .top-blog-item a {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px 15px;
    }

    .top-blog-date {
        font-size: max(13px, 2.4vw);
        margin-bottom: 8px;
        width: 100%;
    }

    .top-blog-item-title {
        font-size: max(16px, 3.2vw);
        line-height: 1.6;
        padding-right: 30px;
    }

    .top-blog-arrow {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
    }

    .top-blog-item a:hover .top-blog-item-title {
        transform: none;
    }

    .top-blog-item a:hover .top-blog-arrow {
        transform: translate(5px, -50%);
    }
}

/* Media Query: max-width: 480px */
@media (max-width: 480px) {
    .top-blog .section-title {
        font-size: 28px;
    }
}


/* ==========================================================================
サイドフローティングボタン
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .side-floating-nav {
        top: auto;
        bottom: 0;
        left: 0;
        right: auto;
        width: 100%;
        flex-direction: row;
        transform: none;
        gap: 0;
        box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.1);
    }

    .side-btn {
        flex: 1;
        border-radius: 0;
        margin-bottom: 0;
        box-shadow: none;
        padding: 15px 0;
        height: auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .side-btn .vertical-text {
        writing-mode: horizontal-tb;
        text-orientation: mixed;
        letter-spacing: 0.1em;
        font-size: 15px;
        line-height: 1.4;
    }

    .side-btn.btn-event {
        border-right: 1px solid rgba(255, 255, 255, 0.3);
    }
}

@media (max-width: 480px) {
    .side-floating-nav {
        transform: translateY(100%);
        transition: transform 0.4s ease;
        visibility: hidden;
        opacity: 0;
    }

    .side-floating-nav.is-show {
        transform: translateY(0);
        visibility: visible;
        opacity: 1;
    }
}

/* ==========================================================================
トップへ戻るボタン
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .back-to-top {
        bottom: 80px;
        right: 10px;
        width: 40px;
        height: 40px;
    }

    .arrow-up {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .top-scroll-down {
        left: auto;
        bottom: 10px;
        left: 1%;
    }

    .top-scroll-down::after {
        height: 30px;
    }
}

/* ==========================================================================
CVセクション（section.cv）
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .cv-grid {
        gap: 3vw;
    }

    .cv-card {
        padding: 6vw 4vw;
    }

    .cv-card-title {
        font-size: 3.2vw;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .cv {
        padding: 8vw 0 10vw;
    }

    .cv-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .cv-card {
        padding: 4vw 4vw 6vw;
    }

    .cv-label {
        margin-bottom: 0.5em;
    }

    .cv-card-title {
        font-size: 24px;
    }

    .cv-bg-text {
        font-size: 25vw;
    }
}

/* ==========================================================================
サブページ共通
========================================================================== */
/* Media Query: max-width: 1200px */
@media (max-width: 1200px) {
    .container-wide {
        padding: 0 20px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .sub-page-header {
        padding: 20px 0 50px;
    }

    .sub-page-title {
        top: 65%;
        font-size: 28px;
    }
}

@media (max-width: 768px) {
    .page-content {
        padding: 40px 0 80px;
    }

    .entry-content h2 {
        font-size: 24px;
        margin: 40px 0 20px;
    }

    .entry-content h3 {
        font-size: 20px;
        margin: 30px 0 15px;
    }
}


/* ==========================================================================
コンセプトページ(concept)
========================================================================== */
@media (max-width: 768px) {
    .concept-sub-header {
        /* SP側の個別設定が必要な場合に記述 */
    }
}

/* ==========================================================================
施工事例一覧ページ(works)
========================================================================== */
/* Media Query: max-width: 1200px */
@media (max-width: 1200px) {
    .work-card.logo {
        display: none;
    }
}

/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .works-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .works-archive {
        padding-top: 6vw;
    }

    .works-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .work-card.logo {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .work-details {
        padding: 20px 10px;
    }

    .work-name {
        font-size: max(16px, 3.2vw);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
}

/* Media Query: max-width: 480px */
@media (max-width: 480px) {
    .works-grid {
        grid-template-columns: 1fr;
    }

    .works-spec-item {
        flex-direction: column;
        gap: 5px;
    }

    .works-spec-item dt {
        width: 100%;
    }
}

/* ==========================================================================
施工事例詳細ページ
========================================================================== */
/* Media Query: max-width: 992px */
@media (max-width: 992px) {
    .works-detail-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .works-gallery {
        margin-bottom: 10vw;
    }

    .works-detail {
        padding: 8vw 0 10vw;
    }

    .works-description {
        font-size: max(16px, 3.2vw);
    }

    .works-detail-title {
        font-size: max(4.8vw, 24px);
    }

    .works-detail-visual {
        margin-bottom: 8vw;
    }

    .works-detail-content {
        margin-bottom: 8vw;
    }

    .works-gallery-grid {
        gap: 10px;
    }

    .works-gallery-item {
        width: calc(50% - 10px * 1 / 2);
    }

    .works-spec-title {
        font-size: max(3.6vw, 18px);
    }

    .works-spec-item dt {
        width: 6em;
    }

    .works-spec-item dd,
    .works-spec-item dt {
        font-size: max(16px, 3.2vw);
    }

}

@media (max-width: 480px) {
    .works-gallery-item {
        width: 100%;
    }
}


/* ==========================================================================
注文住宅ページ（order）
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .order-series-wrapper {
        gap: 10px;
    }

    .order-series-tag {
        font-size: min(1.6vw, 14px);
    }

    .order-series-title {
        font-size: min(2.4vw, 22px);
    }

    .panorama-text-group {
        max-width: 100%;
        padding: 0;
        background: none;
        backdrop-filter: none;
        box-shadow: none;
        text-align: center;
    }

    .panorama-number {
        margin-bottom: 8px;
        opacity: 0.1;
    }

    .panorama-main {
        width: 80%;
        left: 5%;
    }

    .panorama-sub-1 {
        width: 30%;
        left: auto;
        right: 0;
    }

    .panorama-sub-2 {
        width: 25%;
        max-width: 200px;
        left: 0;
        bottom: -10%;
    }

    .panorama-sub-3 {
        display: none;
    }

    .editorial-header-v2 {
        padding-left: 20px;
        gap: 30px;
    }

    .editorial-header-v2 .section-title {
        font-size: 42px;
    }

    .order-spec-wrapper {
        gap: 5vw;
    }

    .order-spec-visual {
        max-width: 100%;
    }

    .order-spec-content {
        padding: 40px 30px;
        margin-left: 0;
    }

    .order-spec-deco {
        font-size: 16vw;
        top: -280px;
    }

    .order-item-body {
        padding: 24px 28px 28px;
    }

    .order-item-title {
        font-size: 28px;
    }

    .order-item-price-yen {
        font-size: 28px;
    }

    .grade-item-top {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 40px;
    }
    .grade-visual {
        max-width: 100%;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .order-series {
        padding: 10vw 0;
    }

    .order-series .section-header {
        margin-bottom: 5vw;
    }

    .order-series-wrapper {
        flex-direction: column;
    }

    .order-series-item a {
        display: flex;
        column-gap: 3%;
    }

    .order-series-img {
        margin-bottom: 0;
        width: 50%;
        flex-shrink: 0;
    }

    .order-series-plan {
        font-size: 3vw;
    }

    .order-series-content {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .order-series-tag {
        font-size: 2.6vw;
    }

    .order-series-title {
        font-size: 3.4vw;
    }

    .order-series-price .order-series-price-label {
        font-size: 3vw;
    }

    .order-spec {
        padding: 10vw 0;
    }

    .order-series-price .order-series-price-value {
        font-size: 4vw;
    }

    .order-spec-item,
    .item-reverse {
        padding-top: 20vw;
        flex-direction: column;
        align-items: flex-start;
    }

    .order-spec-visual {
        width: 100%;
        max-width: 100%;
        margin-bottom: -30px;
    }

    .order-spec-content,
    .item-reverse .order-spec-content {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        padding: 40px 20px;
    }

    .content-text {
        font-size: max(16px, 3.2vw);
    }

    .content-title {
        font-size: max(20px, 4vw);
    }

    .order-spec-deco {
        font-size: 13vw;
        top: -18vw;
        left: 0;
        transform: translate(0);
    }

    .order-concept-message .message-content {
        padding: 5vw 3vw;
    }

    .editorial-header-v2 {
        padding-left: 0;
    }

    .editorial-header-v2 .section-title {
        font-size: max(6.6vw, 29px);
    }

    .content-number {
        font-size: max(44px, 9vw);
    }

    .order-item {
        padding: 8vw 0;
    }

    .order-item-panel {
        grid-template-columns: 1fr;
    }

    .order-item-body {
        padding: 5vw;
        border-left: none;
        border-top: 1px solid rgba(74, 70, 67, 0.08);
    }

    .order-item-header::before {
        height: 48px;
    }

    .order-item-lead {
        flex-direction: column;
        align-items: stretch;
        gap: 5vw;
    }

    .order-item-price {
        width: 100%;
        min-width: 0;
    }

    .order-item-title {
        font-size: max(26px, 6vw);
    }

    .order-item-price-yen {
        font-size: max(28px, 7vw);
    }

    .order-item-meta,
    .order-item-grade,
    .order-item-catch,
    .order-item-heading,
    .order-item-list li,
    .order-point-item dt,
    .order-point-item dd,
    .order-item-price-label,
    .order-item-price-unit,
    .order-item-price-tax,
    .order-item-visual-plan {
        font-size: max(15px, 3.2vw);
    }

    .order-item-body-inner {
        grid-template-columns: 1fr;
        gap: 5vw;
    }

    .order-point-list {
        grid-template-columns: 1fr;
    }

    .order-point-item {
        padding: 5vw 0 0;
        border-right: none;
        border-top: none;
    }

    .order-point-item:first-child {
        border-top: 2px solid var(--color-accent);
        padding-top: 5vw;
    }

    .order-point-item:not(:first-child) {
        margin-top: 4vw;
        padding-top: 5vw;
        border-top: 1px solid var(--color-bg-gray);
    }

    .order-point-item::before {
        font-size: max(24px, 6vw);
    }

    .order-grade-item {
        padding: 10vw 0;
    }
    .grade-item-top {
        gap: 5vw;
        margin-bottom: 5vw;
    }
    .grade-header {
        margin-bottom: 5vw;
    }
    .grade-price-box {
        justify-content: center;
        gap: 3vw;
        margin-bottom: 8vw;
    }
    .grade-recommend {
        padding: 3vw;
    }
    .point-list-cards {
        grid-template-columns: 1fr;
        gap: 4vw;
    }
    .point-card dt {
        padding: 2vw;
    }
    .point-card dd {
        padding: 3vw;
    }
    
    .grade-title {
        text-align: center;
        font-size: max(26px, 6vw);
    }
    .grade-price-box .price-num {
        font-size: max(28px, 7vw);
    }
    .grade-heading-add,
    .grade-heading,
    .grade-catch,
    .grade-tag,
    .grade-list li,
    .price-label,
    .price-unit,
    .price-tax,
    .point-card dt,
    .point-card dd {
        font-size: max(15px, 3.2vw);
    }
}

@media (max-width: 480px) {
    .order-series-item a {
        flex-direction: column;
    }

    .order-series-img {
        margin-bottom: 3vw;
        width: 100%;
    }

    .order-series-plan {
        font-size: max(16px, 3.2vw);
    }

    .order-series-tag {
        font-size: max(15px, 3vw);
    }

    .order-series-title {
        font-size: max(22px, 4.8vw);
    }

    .order-series-price .order-series-price-label {
        font-size: max(15px, 3vw);
    }

    .order-series-price .order-series-price-value {
        font-size: max(24px, 4vw);
    }
}

/* ==========================================================================
リフォームページ（reform）
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .section-title-story {
        font-size: min(5.8vw, 40px);
    }

    .solution-title {
        font-size: 3.2vw;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .story-block-wrapper {
        row-gap: 10vw;
    }

    .story-block,
    .story-block.reverse {
        flex-direction: column-reverse;
        gap: 5vw;
    }

    .story-visual {
        width: 100%;
    }

    .reform-menu-story-deco.deco01 {
        top: -10vh;
    }

    .reform-menu-story-deco.deco03 {
        bottom: -10vh;
    }

    .problem-text {
        font-size: max(16px, 2vw);
    }

    .story-block .story-label,
    .story-block.reverse .story-label {
        border-radius: 0 0 0 4px;
        left: auto;
        right: 0;
        font-size: 2.8vw;
        padding: 4px 20px;
    }

    .reform-panorama {
        height: auto;
        padding: 50px 0;
    }

    .reform-panorama-deco {
        right: auto;
    }

    .reform-panorama-visual {
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 0 5%;
    }

    .reform-panorama .reform-panorama-item {
        position: relative;
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        transform: none;
    }

    .reform-panorama .reform-panorama-item.sub-2 {
        aspect-ratio: 3/4;
        width: 80%;
        align-self: flex-end;
    }

    .reform-guide-table td:last-child {
        border-bottom: none;
    }

    .reform-menu-story-deco {
        width: 60%;
    }

    .reform-guide {
        padding: 10vw 0 14vw;
    }

    .reform-guide .section-title {
        justify-content: center;
        width: 100%;
        font-size: max(4vw, 20px);
    }

    .reform-guide-timing-header {
        display: none;
    }

    .reform-guide-category {
        margin-top: 30px;
        font-size: max(16px, 3.2vw);
    }

    .reform-guide-list {
        background-color: transparent;
        margin-bottom: 0;
    }

    .reform-guide-item {
        display: block;
        background-color: #fff;
        border: 1px solid #eee;
        overflow: hidden;
    }

    .reform-guide-item dt.row-label {
        width: 100%;
        padding: 15px;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 15px;
        border-bottom: 1px solid #eee;
        background-color: #f9f6ef;
    }

    .reform-guide-item dt.row-label i {
        font-size: 20px;
        color: #a68b6d;
    }

    .reform-guide-item dt.row-label span {
        font-size: max(16px, 3.2vw);
        font-weight: 700;
        color: #333;
    }

    .reform-guide-item dd {
        width: 100%;
        padding: 15px;
        border-left: none;
        border-bottom: 1px solid #f0f0f0;
        font-size: max(16px, 3.2vw);
        line-height: 1.6;
    }

    .reform-guide-item dd:last-child {
        border-bottom: none;
    }

    .reform-guide-item dd::before {
        content: attr(data-label);
        display: block;
        font-weight: 700;
        color: var(--color-accent-orange);
        font-size: max(16px, 3.2vw);
        margin-bottom: 5px;
    }

    .reform-partnership-added {
        padding: 40px 0;
    }

    .partnership-flex {
        flex-direction: column;
        gap: 20px;
        padding: 0 20px;
    }

    .partnership-text p {
        font-size: 16px;
        line-height: 1.6;
    }

    .reform-menu-story {
        padding: 10vw 0;
    }

    .section-title-story {
        font-size: max(1.8rem, 5vw)
    }

    .section-desc-story {
        font-size: max(1rem, 3vw)
    }

    .story-content {
        padding: 0 5px;
    }

    .problem-box {
        margin-bottom: 5vw;
    }

    .problem-tag {
        font-size: 15px;
    }

    .problem-text {
        font-size: max(16px, 3.2vw);
    }

    .solution-title {
        font-size: max(1.5rem, 5vw)
    }

    .solution-desc {
        font-size: max(16px, 3.2vw);
    }

    .reform-menu-story .btn-area {
        margin-top: 40px;
    }
}


/* ==========================================================================
注文住宅・リフォームページ共通（order/reform）
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .message-main {
        font-size: max(1.8rem, 5vw);
    }

    .panorama-title {
        font-size: 1.5rem;
    }

    .panorama-main {
        width: 90%;
        left: 5%;
        height: 90%;
    }

    .panorama-sub-1,
    .panorama-sub-2 {
        width: 35%;
    }
}

/* ==========================================================================
建売住宅ページ(estate)
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .estate-intro {
        padding: 3vw 0 8vw;
    }

    .estate-archive {
        padding: 10vw 0 12vw;
    }

    .estate-detail-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 30px;
    }

    .estate-detail-info-box {
        width: 100%;
        justify-content: center;
    }

    .estate-name {
        font-size: max(16px, 3.2vw);
    }

    .estate-price {
        font-size: max(16px, 3.2vw);
    }
}

/* =======================================================================
建売住宅詳細ページ(estate-detail)
========================================================================== */
@media (max-width: 768px) {

    .estate-detail-page {
        padding: 8vw 0 10vw;
    }

    .estate-detail-content {
        margin-bottom: 8vw;
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .estate-gallery {
        margin-bottom: 10vw;
    }

    .estate-gallery-grid{
        gap: 10px;
    }

    .estate-gallery-item{
        width: calc(50% - 10px * 1 / 2);
    }

    .estate-detail-title {
        font-size: max(4.8vw, 24px);
        margin-right: 0;
    }

    .estate-description {
        font-size: max(16px, 3.2vw);
    }

    .estate-detail-visual {
        margin-bottom: 8vw;
    }

    .estate-spec-title {
        font-size: max(3.6vw, 18px);
    }

    .estate-spec-list {
        flex-direction: column;
    }

    .estate-spec-list-left,
    .estate-spec-list-right {
        width: 100%;
    }

    .estate-spec-item dt {
        width: 8em;
    }

    .estate-spec-item dt,
    .estate-spec-item dd {
        font-size: max(16px, 3.2vw);
    }

}

@media (max-width: 480px){
    .estate-spec-item{
        flex-direction: column;
        gap: 10px;
    }
    .estate-spec-item dt{
        width: 100%;
    }
}

/* ==========================================================================
サービスページ(service)
========================================================================== */
/* Media Query: max-width: 992px */
@media (max-width: 992px) {

    .service-card,
    .service-card:nth-child(even) {
        flex-direction: column;
        gap: 40px;
    }

    .service-card-visual {
        width: 100%;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .service-hero {
        padding: 8vw 0;
    }

    .service-list {
        padding: 10vw 0;
    }

    .service-card,
    .service-card:nth-child(even) {
        gap: 3vw;
    }


    .service-card-text {
        font-size: max(16px, 3.2vw);
    }

    .service-card-title {
        font-size: max(5vw, 24px);
    }

    .service-card .service-card-content {
        padding-bottom: 16%;
    }
}

/* ==========================================================================
アフターメンテナンスページ(maintenance)
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .maintenance-lead {
        padding: 4vw 0 0;
    }

    .maintenance-lead-inner {
        gap: 40px;
    }

    .maintenance-lead-title {
        font-size: 4vw;
    }

    .maintenance-points {
        padding: 100px 0;
    }

    .maintenance-points-grid {
        grid-template-columns: 1fr;
        gap: 40px;
        margin-top: 5vw;
    }

    .maintenance-point-card {
        padding: 3% 5%;
    }

    .maintenance-point-card .card-num {
        font-size: 48px;
    }

    .maintenance-point-card .card-title {
        font-size: 22px;
    }

    .maintenance-point-card .card-text {
        font-size: 15px;
    }

    .maintenance-warranty-inner {
        gap: 40px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .maintenance-lead-inner {
        grid-template-columns: 1fr;
        gap: 8vw;
    }

    .maintenance-lead-img {
        height: 60vw;
        order: -1;
    }

    .maintenance-lead-title {
        margin-bottom: 4vw;
    }

    .maintenance-lead-text {
        font-size: max(16px, 3.2vw);
    }

    .maintenance-lead-visual-full {
        margin-top: 8vw;
    }

    .maintenance-points {
        padding: 15vw 0 0;
    }

    .maintenance-points-grid {
        gap: 8vw;
    }

    .maintenance-point-card {
        padding: 5% 8%;
    }

    .maintenance-point-card .card-icon {
        margin-bottom: 0;
        font-size: 8vw;
    }

    .maintenance-point-card .card-num {
        font-size: 10vw;
    }

    .maintenance-point-card .card-title {
        font-size: max(4.4vw, 20px);
    }

    .maintenance-point-card .card-text {
        font-size: max(16px, 3.2vw);
    }
}

/* AFTER MAINTENANCE - Inspection Schedule */
@media (max-width: 1024px) {
    .maintenance-schedule-list {
        padding-left: 0;
        max-width: 700px;
    }

    .maintenance-schedule-list::after {
        display: none;
    }

    .schedule-step-item {
        flex-direction: column;
    }

    .schedule-step-item::before {
        display: none;
    }

    .step-time {
        position: static;
        width: auto;
        text-align: left;
        margin-bottom: 15px;
        font-size: 2.4vw;
    }

    .ieken-header {
        padding: 5vw 3vw
    }

    .ieken-title {
        text-align: center;
    }
}

@media (max-width: 768px) {
    .maintenance-schedule-section {
        padding: 15vw 0;
    }

    .maintenance-schedule-list {
        margin-top: 6vw;
    }

    .step-card {
        padding: 4vw 6vw;
    }

    .step-time {
        font-size: max(16px, 3.2vw);
        margin-bottom: 4vw;
    }

    .step-title {
        font-size: max(4vw, 20px);
        margin-bottom: 3vw;
    }

    .step-list li {
        font-size: max(16px, 3.2vw);
        margin-bottom: 2vw;
        padding-left: 6vw;
    }

    .step-list li::before {
        top: 0.8em;
        transform: translateY(0);
        width: 4vw;
    }

    .ieken-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 20px;
        padding: 5vw 2vw;
    }

    .maintenance-ieken-box {
        margin-top: 0;
    }

    .ieken-logo-wrapper {
        flex: 0 0 auto;
        width: 50%;
    }

    .ieken-title {
        font-size: max(4vw, 20px);
        line-height: 1.4;
        margin-top: 10px;
    }

    .ieken-subtitle {
        font-size: 15px;
    }

    .ieken-content {
        padding: 5%;
    }

    .ieken-intro {
        font-size: max(16px, 3.2vw);
        margin-bottom: 30px;
    }

    .ieken-features {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 40px;
    }

    .ieken-feature-item {
        padding: 5%;
        border-bottom: 1px solid var(--color-bg-gray);
    }

    /* Ieken Spec Table Responsive */
    .ieken-spec-table th,
    .ieken-spec-table td {
        display: block;
        width: 100%;
        padding: 15px 20px;
        font-size: max(16px, 3.2vw);
    }

    .ieken-spec-table th {
        background-color: #f7f9f2;
        border-bottom: none;
    }

    .ieken-spec-table td {
        border-bottom: 1px solid var(--color-bg-gray);
    }

    .ieken-spec-table tr:last-child td {
        border-bottom: none;
    }

    .ieken-note-box {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 20px;
    }

    .ieken-spec-table-wrapper {
        margin-bottom: 40px;
    }

    .ieken-divider {
        padding-bottom: 8vw;
        padding-bottom: 5vw;
    }

    .ieken-divider-text {
        font-size: max(4vw, 20px);
    }

    .feature-title {
        font-size: max(4vw, 20px);
    }

    .feature-text {
        font-size: max(16px, 3.2vw);
    }

    .feature-icon {
        margin-bottom: 0;
        font-size: 10vw;
    }

    .note-text {
        font-size: max(16px, 3.2vw);
    }
}

/* Media Query: max-width: 480px */
@media (max-width: 480px) {
    .maintenance-lead-title {
        font-size: 6vw;
    }

    .maintenance-point-num {
        font-size: 12vw;
    }
}

/* ==========================================================================
イベント情報ページ(event)
========================================================================== */
@media (max-width: 1024px){
    .event-card-link {
        flex-direction: column;
        gap: 4vw;
    }
}
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .event-archive,
    .blog-archive {
        padding: 12vw 0;
    }

    .event-list,
    .blog-list {
        gap: 8vw;
    }

    .event-card-horizontal,
    .blog-card-horizontal {
        padding-bottom: 8vw;
    }

    .event-card-thumb,
    .blog-card-thumb {
        flex: 0 0 auto;
        width: 100%;
        height: 55vw;
    }

    .event-card-title,
    .blog-card-title {
        font-size: 1.25rem;
        margin-bottom: 3vw;
    }

    .event-card-excerpt,
    .blog-card-excerpt {
        font-size: max(16px, 3.2vw);
        margin-bottom: 4vw;
        -webkit-line-clamp: 3;
    }
}

/* ==========================================================================
イベント詳細ページ(event-detail)
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .event-detail-header-bg {
        height: 50vw;
    }

    .event-detail-main-title,
    .blog-detail-main-title {
        font-size: max(4.8vw, 24px);
    }

    .event-detail-content-area,
    .blog-detail-content-area {
        padding: 8vw 0;
    }

    .event-detail-eye-catch,
    .blog-detail-eye-catch {
        margin-bottom: 8vw;
    }

    .event-detail-body h3,
    .blog-detail-body h3 {
        font-size: 1.25rem;
        margin: 10vw 0 5vw;
    }

    .event-detail-body p {
        font-size: max(16px, 3.2vw);
    }
}

/* ==========================================================================
よくある質問ページ(faq)
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .faq-answer-inner {
        padding-left: 60px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .faq-section {
        padding: 60px 0;
    }

    .faq-cat-title {
        font-size: 22px;
        margin-bottom: 30px;
    }

    .faq-cat-title::after {
        width: 30px;
        bottom: -10px;
    }

    .faq-question {
        padding: 25px 15px;
    }

    .q-icon {
        font-size: 16px;
        color: #fff;
        background-color: var(--color-accent);
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 15px;
        flex-shrink: 0;
    }

    .q-text {
        font-size: max(16px, 3.2vw);
        line-height: 1.5;
    }

    .faq-icon-toggle {
        width: 32px;
        height: 32px;
        margin-left: 10px;
    }

    .faq-icon-toggle::before {
        left: 8px;
        right: 8px;
    }

    .faq-icon-toggle::after {
        top: 8px;
        bottom: 8px;
    }

    .faq-answer-inner {
        padding: 30px 15px;
    }

    .a-icon {
        font-size: 18px;
        margin-right: 15px;
        width: 36px;
        text-align: center;
    }

    .a-text {
        font-size: max(16px, 3.2vw);
        line-height: 1.7;
    }

    .faq-nav {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-top: 30px;
    }

    .faq-nav-item {
        width: 100%;
        max-width: 340px;
    }

    .faq-nav-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 15px;
        width: 100%;
        height: 120px;
        background-color: #fff;
        border: 1px solid var(--color-bg-gray);
        color: var(--color-text);
        text-decoration: none;
        border-radius: 8px;
    }

    .faq-nav-btn i {
        font-size: 28px;
        color: var(--color-accent);
    }

    .faq-nav-btn i.icon-money {
        color: var(--color-accent-orange);
    }

    .faq-nav-btn span {
        font-size: max(16px, 3.2vw);
        font-weight: 700;
    }

    .faq-cat-block {
        margin-bottom: 60px;
        scroll-margin-top: 80px;
    }
}

/* ==========================================================================
会社案内ページ(company)
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .message-wrapper {
        flex-direction: column;
        gap: 40px;
    }

    .message-heading {
        flex: none;
        width: 100%;
    }

    .profile-layout {
        flex-direction: column;
        gap: 30px;
    }

    .profile-side {
        flex: none;
    }

    .section-header.side-title .section-title {
        writing-mode: horizontal-tb;
    }

    .profile-main {
        padding: 40px 30px;
    }

    .message-architecture-layout {
        gap: 40px;
    }

    .message-axis {
        display: none;
    }

    .message-bg-word {
        font-size: 60px;
        top: -20px;
    }

    .message-header {
        padding-left: 0;
    }

    .message-lead-text {
        font-size: 30px;
    }

    .message-content-box {
        padding: 5%;
        flex-direction: column;
        gap: 40px;
    }

    .message-visual-minimal {
        width: 100%;
    }

    .message-visual-minimal .image02 {
        display: none;
    }

    .message-text-minimal {
        padding-top: 0;
    }

    .info-grid {
        flex-direction: column;
        row-gap: 30px;
    }

    .access-stack {
        flex-direction: row;
    }

    .access-item {
        width: calc(50% - 30px * 1 / 2);
    }

}

@media (max-width: 768px) {
    .order-concept-message,
    .reform-concept-message{
        max-height: auto;
    }
    .company-message {
        padding: 10vw 0;
    }

    .order-concept-message .message-content,
    .reform-concept-message .message-content {
        padding: 5%;
    }

    .message-lead {
        font-size: 32px;
    }

    .profile-item {
        flex-direction: column;
    }

    .profile-item dt {
        flex: none;
        margin-bottom: 10px;
    }

    .access-grid {
        grid-template-columns: 1fr;
    }

    .access-visual {
        height: 220px;
    }

    .message-lead-text {
        font-size: 24px;
    }

    .message-body {
        margin-bottom: 8vw;
        font-size: max(16px, 3.2vw);
        line-height: 1.8;
    }

    .message-signature-minimal {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .signature-name-ja {
        font-size: 18px;
    }

    .signature-img {
        height: 40px;
        align-self: flex-end;
    }

    .company-summary-section {
        padding: 0 0 60px 0;
    }

    .company-summary-section .container {
        padding-top: 10vw;
    }

    .profile-table-wrapper {
        padding: 30px 20px;
    }

    .profile-table th,
    .profile-table td {
        display: block;
        width: 100%;
        padding: 12px 0;
    }

    .profile-table th {
        border-bottom: none;
        padding-bottom: 4px;
        font-size: max(16px, 3.2vw);
    }

    .profile-table td {
        padding-top: 4px;
        font-size: max(16px, 3.2vw);
        border-bottom: 1px solid #f0f0f0;
    }

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

    .access-stack {
        flex-direction: column;
    }

    .access-item {
        width: 100%;
    }

    .access-visual {
        height: 200px;
    }

    .access-body {
        padding: 20px;
    }

    .access-name {
        font-size: 16px;
    }

}

/* ==========================================================================
お問い合わせページ
========================================================================== */
/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .contact-page {
        padding: 8vw 0 10vw;
    }

    .contact-intro {
        margin-bottom: 8vw;
    }

    .contact-divider {
        margin: 10vw 0;
    }

    .contact-nav {
        flex-direction: column;
        align-items: center;
    }

    .contact-nav-item {
        width: 100%;
        max-width: 340px;
    }

    .contact-nav-btn {
        width: 100%;
    }

    .form-columns {
        flex-direction: column;
        gap: 40px;
    }

    .c-form-item {
        flex-direction: column;
    }

    .c-form-label {
        width: 100%;
        margin-bottom: 10px;
    }

    .form-section-title {
        font-size: 24px;
    }
}

/* ==========================================================================
テクノストラクチャーページ独自スタイル (techno.html)
========================================================================== */
@media (max-width: 1200px) {
    .stat-num {
        font-size: 3vw;
    }

    .techno-concept-content {
        padding: 20px;
    }

    .stat-item {
        padding: 0 10px;
    }
}

@media (max-width: 1024px) {
    .partnership-layout {
        flex-direction: column-reverse;
        max-width: 800px;
    }

    .partnership-content-card {
        border-radius: 4px 4px 0 0;
        width: 100%;
    }

    .partnership-visual img {
        border-radius: 0 0 4px 4px;
        height: auto;
    }

    .techno-partnership {
        padding: 8vw 0 10vw;
    }
}

@media (max-width: 992px) {
    .techno-hero {
        padding: 6vw 0 4vw
    }

    .techno-hero-split {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
    }

    .hero-content-box {
        order: -1;
        margin-bottom: 40px;
        text-align: left;
    }

    .hero-visual-tech,
    .hero-visual-life {
        grid-column: 1;
        grid-row: 2;
        transform: none;
        box-shadow: none;
        border-radius: 0;
    }

    .hero-visual-tech {
        z-index: 2;
        clip-path: polygon(0 0, 100% 0, 0 100%);
    }

    .hero-visual-life {
        z-index: 1;
    }

    .hero-visual-tech img,
    .hero-visual-life img {
        height: 350px;
        border-radius: 8px;
    }

    .tech-badge {
        top: 20px;
        left: 20px;
        bottom: auto;
    }

    .life-badge {
        bottom: 20px;
        right: 20px;
        left: auto;
    }

    .techno-main-copy {
        text-align: center;
        font-size: 32px;
    }

    .hero-sub-copy {
        text-align: center;
    }

    .techno-concept-flex {
        flex-direction: column;
        gap: 40px;
    }

    .techno-concept-content {
        margin-left: 0;
        padding: 5%;
        border-radius: 4px;
        margin-top: -30px;
    }

    .visual-collage {
        padding-bottom: 40px;
    }

    .collage-item.main {
        width: 100%;
        max-width: 600px;
        margin-bottom: -10%;
    }

    .collage-item.sub {
        width: 65%;
        border-width: 2px;
    }

    .techno-video,
    .techno-concept {
        padding: 10vw 0;
    }

    .techno-video-wrapper {
        flex-direction: column;
        gap: 40px;
    }

    .video-text-box {
        flex: 0 0 auto;
        width: 100%;
    }

    .video-frame-container {
        width: 100%;
    }

    .techno-card-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .stat-divider {
        display: block;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.08);
        margin: 5px 0;
    }

    .stat-item {
        padding: 0;
    }

    .stat-num {
        font-size: 42px;
    }

    .stat-num em {
        font-size: 50px;
    }

    .techno-design-flex {
        flex-direction: column;
        gap: 40px;
    }

    .design-visual {
        order: 1;
        width: 100%;
    }

    .design-content {
        order: 2;
        width: 100%;
        margin-right: 0;
        padding: 30px 20px;
        border-radius: 4px;
    }

    .feature-item {
        padding: 15px 20px;
    }

    .feature-val {
        font-size: 30px;
    }
}

@media (max-width: 768px) {
    .techno-main-copy {
        font-size: max(4.8vw, 24px);
    }

    .techno-hero {
        padding: 8vw 0;
    }

    .techno-hero-lead {
        max-width: 80%;
        min-width: 280px;
        font-size: max(16px, 3.2vw);
    }

    .hero-partnership-logo {
        width: 50%;
        max-width: 300px;
    }

    .point-title {
        font-size: max(20px, 4.4vw);
    }

    .point-badge {
        width: 100px;
        height: 100px;
        font-size: 16px;
    }

    .point-subtitle {
        font-size: max(16px, 3.2vw);
    }

    .video-title {
        font-size: max(5vw, 26px);
    }

    .video-desc {
        font-size: max(16px, 3.2vw);
    }

    .point-en {
        font-size: max(12px, 2.2vw);
    }

    .card-body,
    .concept-text,
    .design-text {
        font-size: max(16px, 3.2vw);
    }

    .design-note {
        font-size: max(10px, 2vw);
    }

    .feature-val {
        font-size: max(26px, 5vw);
    }

    .feature-desc,
    .feature-label {
        font-size: max(11px, 2vw);
    }

    .cta-title {
        font-size: max(6vw, 28px);
    }

    .cta-buttons {
        flex-direction: column;
        gap: 20px;
    }

    .cta-buttons .btn-primary,
    .cta-buttons .btn-more {
        width: 100%;
    }

    .techno-partnership {
        padding: 8vw 0;
        overflow: hidden;
    }

    .techno-design {
        padding-bottom: 10vw;
    }

    .section-point-head {
        margin-bottom: 8vw;
    }

    .techno-logic-card .card-title {
        font-size: max(4.2vw, 20px);

    }

    .partnership-layout {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    .partnership-visual {
        flex: 0 0 auto;
        width: 100% !important;
    }

    .partnership-visual img {
        height: auto;
        max-height: 400px;
        object-fit: cover;
    }

    .partnership-content-card {
        flex: 0 0 auto;
        padding: 5vw 0 0;
        box-shadow: none;
        border: none;
        background-color: transparent;
    }

    .partnership-title {
        font-size: max(4.2vw, 22px);
        margin-bottom: 30px;
    }

    .partnership-text {
        font-size: max(16px, 3.2vw);
        padding: 0;
        margin-bottom: 40px;
    }

    .partnership-footer {
        align-items: flex-end;
        gap: 30px;
        border-top: 1px solid rgba(0, 0, 0, 0.06);
        padding-top: 30px;
        width: 100%;
    }

    .pbg-logo {
        width: 160px;
    }
}


@media (max-width: 480px) {
    .concept-stats {
        padding: 5%;
        grid-template-columns: auto;
        display: block;
    }

    .concept-visual {
        flex: 0;
    }

    .stat-divider {
        margin: 10px 0;
        height: 1px;
    }

    .partnership-footer {
        flex-direction: column;
        align-items: center;
    }

    .pbg-logo {
        flex: 0;
    }

    .partnership-meta {
        font-size: 11px;
    }

    .section-point-head {
        gap: 5vw;
    }

    .point-badge {
        width: 80px;
        height: 80px;
        font-size: 12px;
    }

}

/* ==========================================================================
太陽光発電 (solar.html) - Responsive Optimization
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .solar-hero-container {
        gap: 40px;
    }

    .solar-hero-visual img {
        height: 480px;
    }

    .solar-hero-title {
        font-size: 42px;
    }

    .zeros-grid-clean {
        gap: 20px;
    }

    .zero-name {
        font-size: min(2.8vw, 24px);
    }

    .plans-grid {
        gap: 3%;
    }

    .plan-card-body {
        padding: 6% 6%;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .solar-page-hero {
        padding-right: 0;
    }

    .solar-hero-text {
        font-size: max(16px, 3.2vw);
    }

    .solar-hero-container {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }

    .solar-hero-visual {
        width: 100%;
    }

    .solar-hero-visual img {
        height: 400px;
    }

    .solar-hero-content {
        padding: 0 20px;
    }

    .solar-hero-title {
        font-size: max(32px, 6vw);
        margin-bottom: 25px;
    }

    .solar-hero-title .fz_s {
        font-size: 0.45em;
    }

    .aozora-concept {
        padding: 60px 0;
    }

    .aozora-concept-columns {
        flex-direction: column;
    }

    .aozora-concept-visual-side {
        flex: none;
        width: 100%;
        padding: 3% 5%;
        border-right: none;
        justify-content: flex-start;
    }

    .concept-vertical-label {
        writing-mode: horizontal-tb;
        font-size: 2vw;
        letter-spacing: 0.4em;
        opacity: 0.6;
    }

    .aozora-concept-content-side {
        flex: none;
        width: 100%;
        padding: 5%;
    }

    .aozora-concept-content-side::after {
        top: -34vw;
    }

    .aozora-concept-header-compact {
        margin-bottom: 25px;
    }

    .aozora-concept-title {
        font-size: max(24px, 4.8vw);
        margin-bottom: 20px;
        line-height: 1.4;
    }

    .aozora-concept-text {
        font-size: max(16px, 3.2vw);
        line-height: 1.8;
        text-align: left;
    }

    .aozora-zeros-section {
        padding: 60px 0;
        position: relative;
        overflow: hidden;
    }

    .aozora-zeros-section .container {
        position: relative;
        z-index: 1;
    }

    .zeros-bg-rays span {
        width: 3px;
        height: 800px;
        top: -100px;
        right: -100px;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 80%);
    }

    .zeros-minimal-header {
        margin-bottom: 40px;
    }

    .zeros-minimal-title {
        font-size: max(26px, 5vw);
        line-height: 1.4;
        color: var(--color-text);
    }

    .zeros-minimal-title span {
        font-size: 1.35em;
        vertical-align: -0.04em;
        margin: 0 0.05em;
    }

    .zeros-minimal-en {
        font-size: 8px;
        letter-spacing: 0.3em;
        color: var(--color-text-light);
    }

    .zeros-grid-clean {
        grid-template-columns: 1fr;
        gap: 25px;
        margin-top: 40px;
    }

    .zero-card-clean {
        margin: 0 auto;
        max-width: 540px;
        border-radius: 6px;
    }

    .reform-partnership-sincere {
        padding: 8vw 0;
    }

    .s-main-message {
        font-size: 22px;
    }

    .s-award-inner {
        flex-direction: column;
        gap: 25px;
        padding: 40px 20px;
    }

    .s-award-content {
        text-align: center;
    }

    .s-rank {
        font-size: 36px;
    }

    .s-award-title {
        font-size: max(16px, 3.2vw);
    }

    .s-award-target {
        font-size: 20px;
    }

    .reform-partnership-added {
        padding: 80px 0;
    }

    .partnership-premium-layout {
        flex-direction: column;
        gap: 50px;
    }

    .p-brand-cert {
        order: 2;
    }

    .p-award-gold {
        order: 1;
    }

    .premium-divider {
        width: 80px;
        height: 1px;
        background: linear-gradient(to right, transparent, #d4af37, transparent);
        order: 1.5;
    }

        .zero-card-image {
        height: 200px;
    }

    .zero-card-body {
        padding: 30px 20px;
    }

    .zero-huge-num {
        font-size: 120px;
        top: 0;
        right: 10px;
    }

    .zero-name {
        font-size: max(20px, 4vw);
        margin-bottom: 15px;
    }

    .zero-name span {
        font-size: 42px;
    }

    .zero-text {
        font-size: max(16px, 3.2vw);
        line-height: 1.8;
    }

    .solar-plans-section {
        padding: 10vw 0;
    }

    .plans-container {
        padding: 0;
    }

    .plans-grid {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-top: 40px;
    }

    .solar-partnership {
        padding-bottom: 10vw;
    }

    .partnership-box-premium {
        padding: 5%;
    }

    .partnership-heading {
        font-size: max(18px, 3.4vw);
        line-height: 1.5;
    }

    .partnership-description {
        font-size: max(16px, 3.2vw);
        margin-bottom: 40px;
    }

    .partnership-btn-wrap .btn-primary {
        padding: 18px;
        margin: 0 auto;
        width: 100%;
        max-width: 300px;
        display: block;
    }

} 

/* Media Query: max-width: 480px */
@media (max-width: 480px) {
    .solar-plans .design-visual img {
        padding: 10px;
    }
}

/* ==========================================================================
ZEH (az-zeh.html) - Responsive Optimization
========================================================================== */
 @media (max-width: 768px)   {
    .az-zeh-hero-section {
        flex-direction: column;
        gap: 40px;
        padding: 10vw 0;
    }

    .az-zeh-hero-content{
        padding: 5vw;
    }

    .az-zeh-hero-title {
        font-size: 28px;
        line-height: 1.4;
    }

    .az-zeh-hero-lead{
        font-size: max(15px,3vw);
    }

    .az-zeh-builder-badge {
        padding: 5vw;
        margin-bottom: 30px;
        width: 100%;
        box-sizing: border-box;
    }

    .az-zeh-builder-title {
        font-size: 16px;
    }

    .az-zeh-benefit-row,
    .az-zeh-category.reverse .az-zeh-benefit-row {
        flex-direction: column;
        gap: 40px;
    }

    .az-zeh-benefit-visual {
        width: 100%;
    }

    .az-zeh-benefit-text {
        width: 100%;
    }

    .az-zeh-category{
        padding: 8vw 0;
    }

    .az-zeh-category-title {
        font-size: max(22px,4.4vw);
    }

    .az-zeh-category-desc{
        font-size: max(3.2vw,16px);
    }

    .az-zeh-results{
        padding: 8vw 0;
    }

    .az-zeh-results-header {
        margin-bottom: 8vw;
    }

    .az-zeh-results-en {
        font-size: max(11px, 2.8vw);
        letter-spacing: 0.2em;
        margin-bottom: 5px;
    }

    .az-zeh-results-title {
        font-size: max(22px, 5.8vw);
        padding-bottom: 15px;
        line-height: 1.3;
    }

    .az-zeh-results-title::after {
        width: 30px;
    }

    .az-zeh-results-visuals {
        flex-direction: column;
        gap: 8vw;
        margin-bottom: 5vw;
    }

    .az-zeh-results-visual {
        max-width: 100%;
    }

    .az-zeh-table-wrapper {
        padding: 20px;
        overflow: visible;

    }

    .az-zeh-item-title{
        font-size: max(20px,4vw);
    }

    .az-zeh-item-text{
        font-size: max(15px,3vw);
    }

    .az-zeh-table,
    .az-zeh-table thead,
    .az-zeh-table tbody,
    .az-zeh-table tr,
    .az-zeh-table th,
    .az-zeh-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .az-zeh-table {
        border: none;
    }

    .az-zeh-table thead,
    .az-zeh-table .az-zeh-row-head {
        display: none;
    }

    .az-zeh-table .az-zeh-row-value td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 18px 20px;
        background: #fff;
        border: 1px solid #333;
        margin-top: -1px;
        font-size: max(16px, 3vw);
        text-align: right;
    }

    .az-zeh-table .az-zeh-row-value td::before {
        content: attr(data-year);
        font-size: max(16px, 3vw);
        font-weight: 500;
        color: #666;
        text-align: left;
    }

    .az-zeh-table .az-zeh-row-value td:nth-child(5) {
        border-bottom: 1px solid #333;
    }

    .az-zeh-table .az-zeh-row-value td:first-child {
        margin-top: 30px;
        position: relative;
    }

    .az-zeh-table .az-zeh-row-value td:first-child::after {
        content: "ZEH普及実績";
        position: absolute;
        top: -1.5em;
        left: 20px;
        background: #333;
        color: #fff;
        font-size: max(16px, 3vw);
        padding: 2px 8px;
        font-weight: 700;
        letter-spacing: 0.1em;
    }

    .az-zeh-table .az-zeh-row-value td:last-child {
        background-color: #fdfaf6;
        border: 2px solid var(--color-accent);
        position: relative;
        margin-top: 10vw;
    }

    .az-zeh-table .az-zeh-row-value td:last-child::after {
        content: "ZEH普及目標";
        position: absolute;
        top: -1.5em;
        left: 20px;
        background: var(--color-accent);
        color: #fff;
        font-size: max(16px, 3vw);
        padding: 2px 8px;
        font-weight: 700;
        letter-spacing: 0.1em;
    }

    .az-zeh-gx-card-highlight::after{
        width: 12vw;
        top: -11.8vw;
    }

    .az-zeh-gx-card-header {
        margin-bottom: 4vw;
    }

    .az-zeh-gx-card-ruby {
        font-size: max(12px, 2.8vw);
    }

    .az-zeh-gx-card-title {
        font-size: max(20px, 5vw);
    }

    .az-zeh-gx-card-summary {
        font-size: max(15px, 3.8vw);
        min-height: auto;
        margin-bottom: 5vw;
    }

    .az-zeh-gx-list {
        padding-top: 4vw;
    }

    .az-zeh-gx-list li {
        font-size: max(15px, 3.4vw);
        margin-bottom: 4vw;
    }

    .az-zeh-gx-section {
        padding: 12vw 0;
    }

    .az-zeh-gx-header {
        margin-bottom: 14vw;
    }

    .az-zeh-gx-en {
        font-size: max(11px, 2.8vw);
        letter-spacing: 0.2em;
        margin-bottom: 5px;
    }

    .az-zeh-gx-title {
        font-size: max(24px, 6vw);
        line-height: 1.3;
    }

    .az-zeh-gx-lead {
        font-size: max(15px, 3.2vw);
        margin-top: 5vw;
        text-align: left;
    }

    .az-zeh-gx-grid {
        grid-template-columns: 1fr;
        gap: 8vw;
        margin-bottom: 3vw;
    }

    .az-zeh-gx-card {
        padding: 8vw 5vw;
    }

    .az-zeh-gx-card-num {
        font-size: max(36px, 10vw);
        margin-bottom: 4vw;
    }

    .az-zeh-gx-card-title {
        font-size: max(18px, 4.5vw);
        margin-bottom: 3vw;
    }

    .az-zeh-gx-card-text {
        font-size: max(15px, 3.4vw);
    }

}

/* ==========================================================================
断熱性能 (performance.html)
========================================================================== */
/* Media Query: max-width: 1024px */
@media (max-width: 1024px) {
    .perf-intro-flex {
        gap: 50px;
    }

    .perf-title {
        font-size: 38px;
    }

    .perf-visual-wrap {
        flex: 0 0 380px;
    }

    .main-circle {
        width: 240px;
    }

    .node {
        width: 80px;
        height: 80px;
    }

    .node-label {
        font-size: 15px;
    }

    .node.insulation {
        top: -40px;
    }

    .node.airtightness {
        left: -15px;
    }

    .node.hvac {
        right: -15px;
    }
}

/* Media Query: max-width: 768px */
@media (max-width: 768px) {
    .section-padding-lg {
        padding: 10vw 0;
    }

    .section-padding-lg.perf-intro {
        padding-bottom: 5vw;
    }

    .perf-intro-flex {
        flex-direction: column;
        gap: 5vw;
        text-align: center;
    }

    .perf-intro-header {
        order: 1;
        padding: 0;
    }

    .perf-tag-wrap {
        align-items: center;
        margin-bottom: 0.5em;
    }

    .perf-title {
        font-size: max(5.8vw, 29px);
        margin-bottom: 30px;
    }

    .perf-lead-box {
        border-left: none;
        border-top: 1px solid var(--color-bg-gray);
        padding-left: 0;
        padding-top: 25px;
    }

    .perf-lead {
        font-size: max(16px, 3.2vw);
        text-align: left;
    }

    .perf-visual-wrap {
        order: 2;
        flex: none;
        width: 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .main-circle {
        width: 200px;
        border-width: 2px;
    }

    .node {
        width: 70px;
        height: 70px;
        border-width: 2px;
    }

    .node-label {
        font-size: 13px;
    }

    .node.insulation {
        top: -35px;
    }

    .node.airtightness {
        left: -10px;
        bottom: 0;
    }

    .node.hvac {
        right: -10px;
        bottom: 0;
    }

    .graph-deco-circle {
        width: 300px;
        height: 300px;
    }

    .perf-method {
        padding: 10vw 0;
    }

    .perf-method-header-standard {
        margin-bottom: 5vw;
    }

    .perf-method-header-standard .perf-section-title {
        margin-bottom: 3vw;
        font-size: max(28px, 5.8vw);
    }

    .perf-method-header-standard .perf-header-lead {
        font-size: max(16px, 3.2vw);
    }

    .logic-info-standard {
        padding: 0 10px;
    }

    .logic-info-standard h4 {
        margin-bottom: 5vw;
        font-size: max(4vw, 24px);
    }

    .logic-info-standard p {
        text-align: left;
        font-size: max(3.4vw, 16px);
    }

    .logic-visual-large {
        margin-bottom: 5vw;
    }

    .method-logic-stack {
        margin-bottom: 5vw;
    }

    .method-compare-standard {
        padding: 8% 5%;
    }

    .compare-grid-standard {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .compare-diagram {
        margin: 0 auto;
        max-width: 400px;
        height: auto;
    }

    .compare-main-title {
        margin-bottom: 5vw;
        font-size: max(4.2vw, 24px);
    }

    .compare-card {
        padding: 8% 5%;
    }

    .compare-points p {
        font-size: max(16px, 3.2vw);
    }

    .compare-tag {
        margin-bottom: 3vw;
        padding: 0 10px;
        font-size: max(4vw, 20px);
    }

    .perf-pillars-header {
        margin-bottom: 6vw;
    }

    .pillars-container {
        grid-template-columns: 1fr;
        gap: 8vw;
    }

    .pillar-item {
        padding: 5%;
    }

    .pillar-visual {
        margin-bottom: 5vw;
    }

    .pillar-num {
        margin-bottom: 5vw;
        font-size: max(34px, 8vw);
    }

    .pillar-title {
        font-size: max(20px, 4vw);
        height: auto;
        margin-bottom: 15px;
    }

    .perf-section-title {
        font-size: max(6vw, 28px);
    }

    .perf-header-lead {
        font-size: max(3.4vw, 16px);
    }

    .pillar-text {
        font-size: max(16px, 3.2vw);
    }

    .perf-pillars::after {
        width: 94%;
        height: 98%;
        top: 50%;
        clip-path: polygon(50% 0%, 100% 6%, 100% 100%, 0% 100%, 0% 6%);
    }

    .perf-zeh {
        padding: 30px 20px;
        margin-top: 10vw;
        max-width: 100%;
        border-radius: 4px;
    }

    .zeh-knowledge-badge {
        top: -3em;
        width: auto;
        height: 3em;
        padding: 0 12px;
        border-radius: 4px 4px 0 0;
        font-size: max(2.2vw, 10px);
    }

    .zeh-content {
        flex-direction: column-reverse;
        gap: 20px;
        text-align: center;
    }

    .zeh-title {
        justify-content: center;
        font-size: max(4vw, 20px);
    }

    .zeh-title::before {
        display: none;
    }

    .zeh-text p {
        font-size: max(16px, 3.2vw);
    }

    .zeh-icon {
        flex: auto;
        width: 30%;
        min-width: 200px;
        margin: 0 auto;
    }

    .perf-zeh-btn-wrap {
        margin-top: 25px;
    }

    .perf-zeh-btn {
        width: 100%;
        max-width: 340px;
        justify-content: center;
        padding: 15px 20px;
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .perf-pillars::after {
        clip-path: polygon(50% 0%, 100% 4%, 100% 100%, 0% 100%, 0% 4%);
    }
}

/* ==========================================================================
コンセプトページ(concept)
========================================================================== */
@media (max-width: 1024px) {
    .concept-vision-title {
        font-size: min(4.8vw, 38px);
    }

    .concept-vision-text {
        padding-right: 5%;
    }

    .commitment-grid {
        margin: 0 auto;
        max-width: 700px;
        gap: 20px;
    }

    .commitment-card {
        width: calc(50% - 20px * 1 / 2);
    }
}

@media (max-width: 768px) {
    .concept-intro {
        padding: 3vw 0 0;
    }

    .concept-intro-lead {
        font-size: max(16px, 3vw);
    }

    .concept-vision {
        padding: 10vw 0;
    }

    .concept-vision-content {
        flex-direction: column;
        gap: 0;
        max-width: 100%;
    }

    .concept-vision-image {
        width: 100%;
        margin-left: 0;
        padding-top: 0;
        margin-bottom: 50px;
        order: 1;
    }

    .concept-vision-image img {
        height: 450px;
    }

    .concept-vision-image::after {
        display: none;
    }

    .concept-vision-title {
        writing-mode: horizontal-tb;
        position: static;
        transform: none;
        padding: 0;
        box-shadow: none;
        font-size: max(6.8vw, 26px);
        line-height: 1.4;
        margin-bottom: 0;
        order: 2;
        background: transparent;
        white-space: normal;
    }

    .concept-vision-text {
        width: 100%;
        padding-right: 0;
        min-height: auto;
        order: 3;
    }

    .concept-vision-label {
        margin-bottom: 25px;
        padding-left: 50px;
        font-size: max(4.4vw, 22px);
    }

    .concept-vision-label::before {
        width: 35px;
    }

    .concept-vision-body {
        max-width: none;
        width: 100%;
    }

    .concept-vision-body p {
        font-size: max(16px, 3.2vw);
        line-height: 2;
    }

    .section-header.center .section-title {
        font-size: 26px;
        margin-bottom: 20px;
        padding-bottom: 15px;
    }

    .section-en {
        font-size: 12px;
        margin-bottom: 15px;
    }

    .section-header.center .section-desc {
        font-size: 15px;
        line-height: 1.8;
    }

    .concept-commitment {
        padding: 60px 0;
    }

    .commitment-grid {
        margin-top: 40px;
    }

    .commitment-content {
        padding: 8% 5%;
    }

    .commitment-title {
        font-size: max(3vw, 16px);
    }

    .commitment-text {
        font-size: max(2.4vw, 14px);
    }

    .concept-voices {
        padding: 10vw 0;
    }

    .voices-grid {
        max-width: 700px;
        margin: 0 auto;
        grid-template-columns: 1fr;
        gap: 30px;
        margin-top: 40px;
    }

    .voice-title {
        font-size: max(3.2vw, 16px);
    }

    .voice-name {
        font-size: max(16px, 3.2vw);
    }

    .voice-tag {
        font-size: max(2vw, 11px);
    }

    .voice-text {
        font-size: max(3.2vw, 16px);
    }
}

@media (max-width: 480px) {
    .commitment-card {
        width: 100%;
    }

    .commitment-title {
        font-size: max(4vw, 20px);
    }

    .commitment-text {
        font-size: max(3.2vw, 15px);
    }
}

/* ==========================================================================
イベントアーカイブ (SP用サイドバー調整)
========================================================================== */
@media (max-width: 768px) {
    .event-archive-flex,
    .blog-archive-flex {
        flex-direction: column;
        gap: 60px;
    }

    .event-sidebar,
    .blog-sidebar {
        width: 100%;
        position: static;
        order: 2;
        /* リストの後に配置 */
    }

    .sidebar-widget {
        margin-bottom: 40px;
        background: #fff;
        padding: 5% 8%;
        border: 1px solid #f0f0f0;
    }

    .widget-title {
        font-size: max(3.4vw, 18px);
        margin-bottom: 20px;
    }

    .widget-list a {
        font-size: max(3vw, 16px);
        padding: 12px 0;
    }
}

/* ==========================================================================
プライバシーポリシー
========================================================================== */
@media screen and (max-width: 768px) {
    .privacy-page .privacy-content {
        padding: 40px 20px;
    }

    .privacy-contact-info {
        padding: 5%;
    }

    .privacy-item-title {
        font-size: 18px;
    }
}

/* ======================================================================
トップページヒーロー (Hero Event Box)
========================================================================== */
@media (max-width: 992px) {
    .hero-event-box {
        bottom: 0;
    }
}

@media screen and (max-width: 768px) {
    .hero-event-box {
        min-width: 300px;
        padding: 12px 16px;
    }

    .hero-event-box-title {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .hero-event-label {
        gap: 8px;
        margin-bottom: 8px;
    }

    .label-text {
        font-size: 14px;
    }

    .hero-event-more {
        font-size: 14px;
    }

    .top-hero .hero-text-sub-wrapper {
        top: calc(80px + 5%);
        font-size: max(3.8vw, 20px);
    }

    .top-hero .hero-text-main-wrapper {
        margin-bottom: 3vw;
        font-size: max(4vw, 24px);
    }

    .top-hero .hero-main-text-logo {
        width: 80vw;
    }

    .az-zeh-gx-visual {
        margin-top: 8vw;
        max-width: 500px;
    }

    .az-zeh-results-btn-area {
        margin-top: 40px;
        padding: 0 20px;
    }

    .az-zeh-external-btn {
        max-width: 400px;
        padding: 15px 15px;
        font-size: 15px;
        gap: 10px;
    }

    .az-zeh-measures-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin: 30px auto 40px;
    }

    .az-zeh-measure-item {
        padding: 20px;
    }

    .az-zeh-measure-title {
        font-size: max(16px,3.2vw);
        margin-bottom: 15px;
    }

    .az-zeh-measure-list li{
        font-size: max(15px,3vw);
    }
}

@media (max-width: 480px) {
    .hero-event-box {
        bottom: 10px;
        width: 80%;
        min-width: auto;
    }

    .top-hero .hero-text-main-wrapper {
        top: 54%;
    }

    .top-hero.pattern-c::after {
        display: none;
    }

    .az-zeh-results-btn-area{
        padding: 0;
    }
}

/* ==========================================================================
TOPこだわり
========================================================================== */
@media (max-width: 768px) {
    .top-commitment {
        padding: 8vw 0;
    }

    .top-commitment .section-header{
        margin-bottom: 5vw;
    }

    .top-commitment-grid {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 40px;
    }

    .top-commitment-card {
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    }

    .top-commitment-content {
        padding: 25px 20px;
    }

    .top-commitment-title {
        font-size: max(18px, 4vw);
    }

    .top-commitment-num {
        font-size: max(20px, 5vw);
        top: 15px;
        left: 15px;
    }
}
/* ==========================================================================
404
========================================================================== */
@media (max-width: 768px) {
    .error-nav-grid {
        grid-template-columns: 1fr !important;
    }
}