html {
    scroll-behavior: smooth;
	    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
/* ==========================================
   GLOBAL FONT - SAFARI SUPPORT
========================================== */

body {
    font-family:
        "Helvetica Neue",
        Arial,
        "Hiragino Kaku Gothic ProN",
        "Hiragino Sans",
        "Yu Gothic",
        Meiryo,
        sans-serif;

    -webkit-font-smoothing: antialiased;
}
/* ==========================================
   HEADER - PC
========================================== */

.site-header {
    position: relative;
    z-index: 1000;
    width: 100%;
    background: transparent;
}

.site-header *,
.site-header *::before,
.site-header *::after {
    box-sizing: border-box;
}

/* ヘッダー全体 */

.site-header__inner {
    width: calc(100% - 100px);
    max-width: 1800px;
    min-height: 115px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

/* ==========================================
   LOGO
========================================== */

.site-header__logo {
    width: 190px;
    flex-shrink: 0;
}

.site-header__logo a {
    display: block;
    width: 100%;
}

.site-header__logo img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================
   NAVIGATION
========================================== */

.site-header__nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(20px, 2.5vw, 42px);
    padding: 6px 7px 6px 36px;
    min-height: 68px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.035);
    border-radius: 22px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.025);
}

/* メニュー */

.site-header__menu {
    display: flex;
    align-items: center;
    gap: clamp(20px, 2.3vw, 44px);
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-header__menu li {
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

.site-header__menu a {
    display: inline-block;
    color: #222222;
    font-size: clamp(13px, 0.95vw, 17px);
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    transition: color 0.3s ease;
}

.site-header__menu a:hover {
    color: #079b39;
}

/* ==========================================
   CONTACT BUTTON
========================================== */

.site-header__contact {
    width: 225px;
    min-height: 54px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 10px 38px 10px 20px;
    background: #079b39;
    border-radius: 20px;
    color: #ffffff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.site-header__contact:hover {
	color: #087f31;
    background: #fff;
}

/* ==========================================
   ARROW
========================================== */

.site-header__arrow {
    position: absolute;
    right: 21px;
    top: 50%;
    width: 22px;
    height: 1px;
    background: currentColor;
    transform: translateY(-50%);
}

.site-header__arrow::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 9px;
    height: 9px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
}

/* ==========================================
   HAMBURGER / MOBILE NAV
========================================== */

.site-header__hamburger,
.site-header__mobile-nav {
    display: none;
}

/* ==========================================
   SMALL PC / TABLET
   768px - 1350px
========================================== */

@media screen and (min-width: 768px) and (max-width: 1350px) {

    .site-header__inner {
        width: calc(100% - 48px);
        min-height: 100px;
        gap: 18px;
    }

    .site-header__logo {
        width: clamp(110px, 12vw, 160px);
    }

    .site-header__nav {
        gap: clamp(12px, 1.5vw, 22px);
        padding: 5px 6px 5px 20px;
        min-height: 60px;
        border-radius: 18px;
    }

    .site-header__menu {
        gap: clamp(10px, 1.5vw, 22px);
    }

    .site-header__menu a {
        font-size: clamp(11px, 1vw, 14px);
    }

    .site-header__contact {
        width: clamp(145px, 15vw, 190px);
        min-height: 48px;
        padding: 8px 28px 8px 12px;
        font-size: clamp(12px, 1.1vw, 15px);
        border-radius: 16px;
    }

    .site-header__arrow {
        right: 13px;
        width: 17px;
    }

    .site-header__arrow::after {
        width: 7px;
        height: 7px;
    }
}


/* ==========================================
   FOOTER - PC
========================================== */

.site-footer {
    width: 100%;
    background: #ffffff;
    padding: 70px 0;
}

.site-footer *,
.site-footer *::before,
.site-footer *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.site-footer__inner {
    width: calc(100% - 100px);
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

/* ==========================================
   LOGO
========================================== */

.site-footer__logo {
    width: 160px;
    flex-shrink: 0;
}

.site-footer__logo a {
    display: block;
    width: 100%;
}

.site-footer__logo img {
    display: block;
    width: 100%;
    height: auto;
}

/* ==========================================
   NAVIGATION
========================================== */

.site-footer__nav {
    width: 280px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ==========================================
   MENU
========================================== */

.site-footer__menu {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer__menu li {
    width: 100%;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #222222;
}

.site-footer__menu a {
    display: block;
    width: 100%;
    padding: 15px 0;
    color: #222222;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    transition:
        color 0.3s ease,
        padding-left 0.3s ease;
}

.site-footer__menu a:hover {
    color: #079b39;
    padding-left: 6px;
}

/* ==========================================
   CONTACT BUTTON
========================================== */

.site-footer__contact {
    width: 190px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 38px;
    padding: 8px 15px;
    background: #009b00;
    border-radius: 11px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.site-footer__contact:hover {
	 color: #087f31;
    background: #fff;
}

/* ==========================================
   TABLET
   768px - 1100px
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .site-footer {
        padding: 60px 0;
    }

    .site-footer__inner {
        width: calc(100% - 70px);
        gap: 40px;
    }

    .site-footer__logo {
        width: 140px;
    }

    .site-footer__nav {
        width: 240px;
    }

    .site-footer__menu a {
        font-size: 14px;
        padding: 13px 0;
    }

    .site-footer__contact {
        width: 170px;
        min-height: 38px;
        font-size: 13px;
        margin-top: 30px;
    }
}

/* ==========================================
   FIRST VIEW - PC
========================================== */

.fv {
    position: relative;
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    overflow: hidden;
    margin-top: -115px;
    padding-top: 115px;
    box-sizing: border-box;
}

/* ==========================================
   BACKGROUND
========================================== */

.fv__background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-image: url("../images/fv-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    z-index: 0;
}

/* ==========================================
   INNER
========================================== */

.fv__inner {
    position: relative;
    z-index: 1;
    width: calc(100% - 100px);
    max-width: 1500px;
    margin: 0 auto;
    padding-top: 25px;
}

/* ==========================================
   CONTENT
========================================== */

.fv__content {
    width: fit-content;
    max-width: 100%;
}

/* ==========================================
   MAIN TITLE
========================================== */

.fv__title {
    margin: 0;
    padding: 0;
    color: #292929;
    font-size: clamp(27px, 2.55vw, 44px);
    font-weight: 800;
    line-height: 1.38;
    letter-spacing: 0.025em;
}

.fv__title-line {
    display: block;
    width: fit-content;
    max-width: 100%;
}

/* ==========================================
   GREEN TEXT
========================================== */

.fv__title-line--green {
    color: #006c27;
}

/* 黄色のマーカー */

.fv__highlight {
    position: relative;
    display: inline;
    z-index: 0;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    background: linear-gradient(
        transparent 79%,
        #f3f22b 79%,
        #f3f22b 96%,
        transparent 96%
    );
}

/* ==========================================
   DESCRIPTION
========================================== */

.fv__description {
    margin: 20px 0 0;
    padding: 0;
    color: #292929;
    font-size: clamp(13px, 1.13vw, 19px);
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: 0.015em;
	    -webkit-text-stroke: 0.3px #ffffff;

    text-shadow:
        1px 1px 0 #ffffff,
        -1px 1px 0 #ffffff,
        1px -1px 0 #ffffff,
        -1px -1px 0 #ffffff,
        0 2px 5px rgba(0, 0, 0, 0.12);
}

/* ==========================================
   PC ONLY
========================================== */

.fv__pc-only {
    display: inline;
}

/* ==========================================
   SMALL PC / TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .fv {
        margin-top: -100px;
        padding-top: 100px;
        min-height: 680px;
    }

    .fv__inner {
        width: calc(100% - 70px);
        padding-top: 20px;
    }

    .fv__title {
        font-size: clamp(25px, 3vw, 34px);
    }

    .fv__description {
        font-size: 13px;
        margin-top: 16px;
    }

    .fv__background {
        background-position: 55% center;
    }
}


/* ==========================================
   FV BICYCLE ANIMATION - PC
========================================== */

.fv__bicycles {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
}

/* ==========================================
   BICYCLE COMMON
========================================== */

.fv__bicycle {
    position: absolute;
    display: block;
    left: 0;
    top: 0;

    width: 55px;
    height: auto;
    max-width: none;
    object-fit: contain;

    opacity: 0;
    transform-origin: center bottom;

    will-change: transform, opacity;

    animation: fvBicycleRide 16s linear infinite;
}

/* ==========================================
   BICYCLE 01
========================================== */

.fv__bicycle--01 {
    width: 60px;
    animation-delay: 0s;
}

/* ==========================================
   BICYCLE 02
========================================== */

.fv__bicycle--02 {
    width: 55px;
    animation-delay: -4s;
}

/* ==========================================
   BICYCLE 03
========================================== */

.fv__bicycle--03 {
    width: 58px;
    animation-delay: -8s;
}

/* ==========================================
   BICYCLE 04
========================================== */

.fv__bicycle--04 {
    width: 53px;
    animation-delay: -12s;
}

/* ==========================================
   ROAD FOLLOWING ANIMATION
========================================== */

@keyframes fvBicycleRide {

    0% {
        transform:
            translate(
                calc(var(--bike-x0, -100px) - 50%),
                calc(var(--bike-y0, -100px) - 100%)
            )
            scale(1);
        opacity: 0;
    }

    10% {
        transform:
            translate(
                calc(var(--bike-x1, -100px) - 50%),
                calc(var(--bike-y1, -100px) - 100%)
            )
            scale(0.85);
        opacity: 1;
    }

    20% {
        transform:
            translate(
                calc(var(--bike-x2, -100px) - 50%),
                calc(var(--bike-y2, -100px) - 100%)
            )
            scale(0.65);
        opacity: 1;
    }

    30% {
        transform:
            translate(
                calc(var(--bike-x3, -100px) - 50%),
                calc(var(--bike-y3, -100px) - 100%)
            )
            scale(0.5);
        opacity: 0;
    }

    100% {
        transform:
            translate(
                calc(var(--bike-x3, -100px) - 50%),
                calc(var(--bike-y3, -100px) - 100%)
            )
            scale(0.5);
        opacity: 0;
    }
}
/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .fv__bicycle--01 { width: 50px; }
    .fv__bicycle--02 { width: 46px; }
    .fv__bicycle--03 { width: 48px; }
    .fv__bicycle--04 { width: 45px; }

}
/* ==========================================
   CONTENT LAYER
========================================== */

.fv__inner {
    position: relative;
    z-index: 2;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .fv__bicycle--01 {
        width: 50px;
    }

    .fv__bicycle--02 {
        width: 46px;
    }

    .fv__bicycle--03 {
        width: 48px;
    }

    .fv__bicycle--04 {
        width: 45px;
    }
}

/* ==========================================
   ABOUT SECTION - PC
========================================== */

.about-section {
    position: relative;
    width: 100%;
    padding: 100px 0;
    background: #ffffff;
    overflow: hidden;
}

.about-section *,
.about-section *::before,
.about-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.about-section__inner {
    position: relative;
    z-index: 1;
    width: calc(100% - 100px);
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
}

/* ==========================================
   LEFT CONTENT
========================================== */

.about-section__content {
    width: 48%;
    flex-shrink: 0;
}

/* ==========================================
   SECTION HEADING
========================================== */

.about-section__heading {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 22px;
    margin-bottom: 28px;
}

/* 薄緑の円 */

.about-section__heading::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    left: -45px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #eef9ef;
    z-index: -1;
}

/* About */

.about-section__title {
    margin: 0;
    padding: 0;
    color: #000000;
    font-size: clamp(48px, 4.5vw, 72px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.045em;
}

.about-section__title span {
    color: #009b00;
}

/* 日本語サブタイトル */

.about-section__subtitle {
    margin: 0;
    color: #111111;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}

/* ==========================================
   CATCH COPY
========================================== */

.about-section__catch {
    margin: 0 0 36px;
    color: #111111;
    font-size: clamp(19px, 1.7vw, 25px);
    font-weight: 800;
    line-height: 1.7;
    letter-spacing: 0.01em;
}

/* ==========================================
   BODY TEXT
========================================== */

.about-section__text {
    width: 100%;
}

.about-section__text p {
    margin: 0 0 24px;
    color: #111111;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.85;
    letter-spacing: 0.015em;
}

.about-section__text p:last-child {
    margin-bottom: 0;
}

/* ==========================================
   BUTTON
========================================== */

.about-section__button {
    position: relative;
    width: 175px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 50px auto 0;
    padding: 10px 38px 10px 16px;
    background: #009b00;
    border-radius: 11px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.about-section__button:hover {
    background: #fff;
	    color: #087f31;

}

/* 矢印 */

.about-section__arrow {
    position: absolute;
    right: 17px;
    top: 50%;
    width: 20px;
    height: 2px;
    background: currentColor;
    transform: translateY(-50%);
}

.about-section__arrow::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
}

/* ==========================================
   RIGHT IMAGE
========================================== */

.about-section__image {
    width: 52%;
    flex-shrink: 1;
}

.about-section__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ==========================================
   DOT DECORATION
========================================== */

.about-section__dots {
    position: absolute;
    top: 0;
    right: 0;
    width: 330px;
    height: 260px;
    opacity: 0.6;
    background-image: radial-gradient(
        circle,
        #b8ecc2 3.5px,
        transparent 4px
    );
    background-size: 23px 23px;
    pointer-events: none;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .about-section {
        padding: 80px 0;
    }

    .about-section__inner {
        width: calc(100% - 70px);
        gap: 40px;
    }

    .about-section__content {
        width: 50%;
    }

    .about-section__image {
        width: 50%;
    }

    .about-section__title {
        font-size: 52px;
    }

    .about-section__subtitle {
        font-size: 12px;
    }

    .about-section__catch {
        font-size: 19px;
        margin-bottom: 25px;
    }

    .about-section__text p {
        font-size: 13px;
        margin-bottom: 18px;
    }

    .about-section__button {
        margin-top: 35px;
    }
}

/* ==========================================
   LOUIS OFFICE MARQUEE - PC
========================================== */

.louis-marquee {
    position: relative;
    width: 100%;
    padding: 15px 0;
    background: #ffffff;
    overflow: hidden;
}

/* 横に流れるトラック */

.louis-marquee__track {
    display: flex;
    width: max-content;
    animation: louisMarqueeScroll 100s linear infinite;
    will-change: transform;
}

/* 文字のグループ */

.louis-marquee__group {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 35px;
    padding-right: 35px;
}

/* Louis Office */

.louis-marquee__group span {
    display: block;
    flex-shrink: 0;
    color: #e6f7e8;
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(90px, 10vw, 175px);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.045em;
    white-space: nowrap;
}

/* ==========================================
   ANIMATION
========================================== */

@keyframes louisMarqueeScroll {

    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .louis-marquee {
        padding: 12px 0;
    }

    .louis-marquee__group span {
        font-size: 110px;
    }

}

/* ==========================================
   WHAT WE DO SECTION - PC
========================================== */

.what-section {
    position: relative;
    width: 100%;
    min-height: 720px;
    padding: 55px 0 100px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.what-section *,
.what-section *::before,
.what-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   MAIN CONTENT
========================================== */

.what-section__inner {
    position: relative;
    z-index: 2;
    width: calc(100% - 40px);
    max-width: 540px;
    margin: 0 auto;
    text-align: center;
}

/* ==========================================
   HEADING
========================================== */

.what-section__heading {
    position: relative;
    margin-bottom: 25px;
}

/* 薄緑の円 */

.what-section__heading::before {
    content: "";
    position: absolute;
    top: -18px;
    left: -35px;
    width: 95px;
    height: 95px;
    background: #eaf8ec;
    border-radius: 50%;
    z-index: -1;
}

/* WHAT WE DO */

.what-section__title {
    margin: 0;
    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(42px, 4.2vw, 65px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.045em;
    white-space: nowrap;
}

.what-section__title span {
    color: #009b00;
}

/* ==========================================
   CATCH COPY
========================================== */

.what-section__catch {
    margin: 0 0 30px;
    color: #111111;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.6;
    letter-spacing: 0;
}

/* ==========================================
   TEXT
========================================== */

.what-section__text {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
}

.what-section__text p {
    margin: 0 0 25px;
    color: #111111;
    font-size: 14px;
    font-weight: 600;
    line-height: 2;
    letter-spacing: 0.01em;
}

.what-section__text p:last-child {
    margin-bottom: 0;
}

/* ==========================================
   DECORATION IMAGES
========================================== */

.what-section__image {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.what-section__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* 左上 */

.what-section__image--tl {
    top: 55px;
    left: 5%;
    width: 25%;
    max-width: 360px;
}

/* 右上 */

.what-section__image--tr {
    top: 35px;
    right: 6%;
    width: 20%;
    max-width: 290px;
}

/* 左下 */

.what-section__image--bl {
    bottom: 90px;
    left: 8%;
    width: 23%;
    max-width: 320px;
}

/* 右下 */

.what-section__image--br {
    bottom: 70px;
    right: 7%;
    width: 22%;
    max-width: 310px;
}

/* ==========================================
   DOT DECORATION
========================================== */

.what-section__dots {
    position: absolute;
    z-index: 0;
    left: -20px;
    bottom: -20px;
    width: 350px;
    height: 270px;
    opacity: 0.55;

    background-image: radial-gradient(
        circle,
        #b8ecc2 3px,
        transparent 3.5px
    );

    background-size: 22px 22px;
    pointer-events: none;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .what-section {
        min-height: 650px;
        padding: 65px 0 90px;
    }

    .what-section__inner {
        max-width: 440px;
    }

    .what-section__title {
        font-size: 48px;
    }

    .what-section__catch {
        font-size: 18px;
    }

    .what-section__text p {
        font-size: 12px;
    }

    .what-section__image--tl {
        width: 25%;
        left: 2%;
    }

    .what-section__image--tr {
        width: 22%;
        right: 2%;
    }

    .what-section__image--bl {
        width: 23%;
        left: 3%;
    }

    .what-section__image--br {
        width: 23%;
        right: 3%;
    }
}

/* ==========================================
   SERVICE CARDS - PC
========================================== */

.service-cards {
    position: relative;
    width: 100%;
    padding: 60px 0 90px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.service-cards *,
.service-cards *::before,
.service-cards *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.service-cards__inner {
    position: relative;
    z-index: 1;
    width: calc(100% - 100px);
    max-width: 1380px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 50px;
}

/* ==========================================
   CARD
========================================== */

.service-card {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 0.9;
    overflow: hidden;
    text-decoration: none;
    color: #000000;
    cursor: pointer;
    isolation: isolate;
}

/* ==========================================
   BACKGROUND IMAGE
========================================== */

.service-card__image {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}

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

    transition: transform 0.7s ease;
}

/* ホバーで背景を少し拡大 */

.service-card:hover .service-card__image img {
    transform: scale(1.06);
}

/* ==========================================
   WHITE FILTER
========================================== */

.service-card__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background: rgba(255, 255, 255, 0.62);

    transform: scale(1);
    transform-origin: center center;

    transition:
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.65s ease;

    pointer-events: none;
}

/* ホバー時：白フィルターが縮小 */

.service-card:hover .service-card__overlay {
    transform: scale(0.15);
    opacity: 0;
}

/* ==========================================
   CONTENT
========================================== */

.service-card__content {
    position: absolute;
    inset: 0;
    z-index: 2;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 20px;
    text-align: center;
    pointer-events: none;
}

/* ==========================================
   TITLE
========================================== */

.service-card__title {
    margin: 0 0 26px;
    padding: 0;

    color: #000000;
    font-size: clamp(19px, 2vw, 27px);
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: 0.015em;

    transition: transform 0.4s ease;
}

.service-card:hover .service-card__title {
    transform: translateY(-4px);
}

/* ==========================================
   GREEN CIRCLE BUTTON
========================================== */

.service-card__button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 64px;
    height: 64px;
    border-radius: 50%;

    background: rgba(0, 145, 0, 0.85);
    color: #ffffff;

    transition:
        background 0.35s ease,
        transform 0.35s ease;
}

.service-card:hover .service-card__button {
    background: #008e16;
    transform: scale(1.08);
}

/* ==========================================
   ARROW
========================================== */

.service-card__arrow {
    position: relative;
    display: block;
    width: 24px;
    height: 2px;
    background: #ffffff;
}

.service-card__arrow::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;

    width: 9px;
    height: 9px;

    border-top: 2px solid #ffffff;
    border-right: 2px solid #ffffff;

    transform: translateY(-50%) rotate(45deg);
}

/* ==========================================
   DOT DECORATION
========================================== */

.service-cards__dots {
    position: absolute;
    z-index: 0;

    top: 0;
    left: -15px;

    width: 390px;
    height: 280px;

    background-image: radial-gradient(
        circle,
        #bdeec8 3.5px,
        transparent 4px
    );

    background-size: 24px 24px;
    opacity: 0.55;
    pointer-events: none;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .service-cards {
        padding: 50px 0 75px;
    }

    .service-cards__inner {
        width: calc(100% - 60px);
        gap: 25px;
    }

    .service-card__title {
        font-size: 19px;
        margin-bottom: 20px;
    }

    .service-card__button {
        width: 54px;
        height: 54px;
    }
}

/* ==========================================
   STRENGTH SECTION - PC
========================================== */

.strength-section {
    position: relative;
    width: 100%;
    padding: 140px 0 90px;
    background: #ffffff;
}

.strength-section *,
.strength-section *::before,
.strength-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   OUTER
========================================== */

.strength-section__outer {
    position: relative;
    width: calc(100% - 100px);
    max-width: 1380px;
    margin: 0 auto;
}

/* ==========================================
   PEOPLE ILLUSTRATION
========================================== */

.strength-section__people {
    position: absolute;
    z-index: 3;
    top: -145px;
    right: 65px;
    width: 250px;
    pointer-events: none;
}

.strength-section__people img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ==========================================
   GREEN PANEL
========================================== */

.strength-section__panel {
    position: relative;
    width: 100%;
    padding: 60px 65px 75px;
    background: #299c38;
    border-radius: 90px;
    overflow: hidden;
    isolation: isolate;
}

/* ==========================================
   INNER
========================================== */

.strength-section__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1150px;
    margin: 0 auto;
}

/* ==========================================
   HEADING
========================================== */

.strength-section__heading {
    margin: 0 0 45px;
    color: #ffffff;
    font-size: clamp(25px, 2.6vw, 38px);
    font-weight: 800;
    line-height: 1.5;
    text-align: center;
    letter-spacing: 0.01em;
}

/* ==========================================
   STRENGTH LIST
========================================== */

.strength-section__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 65px;
}

/* ==========================================
   ITEM
========================================== */

.strength-section__item {
    position: relative;
    min-width: 0;
}

/* ==========================================
   IMAGE
========================================== */

.strength-section__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 200px;
    margin-bottom: 28px;
}

/* 背面の薄緑の円 */

.strength-section__image::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
}

.strength-section__image--01::before {
    top: 30px;
    left: 25%;
}

.strength-section__image--02::before {
    top: 10px;
    left: 5%;
}

.strength-section__image--03::before {
    bottom: 0;
    left: 5%;
}

.strength-section__image img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    max-width: 250px;
    height: 100%;
    object-fit: contain;
}

/* ==========================================
   CONTENT
========================================== */

.strength-section__content {
    width: 100%;
    max-width: 250px;
    margin: 0 auto;
}

/* ==========================================
   TITLE
========================================== */

.strength-section__title {
    margin: 0 0 18px;
    color: #ffffff;
    font-size: clamp(20px, 2vw, 27px);
    font-weight: 800;
    line-height: 1.4;
    white-space: nowrap;
}

/* ==========================================
   TEXT
========================================== */

.strength-section__text {
    margin: 0;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.01em;
}

/* ==========================================
   DOT DECORATIONS
========================================== */

.strength-section__dots {
    position: absolute;
    z-index: 0;
    pointer-events: none;

    background-image: radial-gradient(
        circle,
        rgba(220, 255, 220, 0.65) 3px,
        transparent 3.5px
    );

    background-size: 15px 15px;
}

/* 右上 */

.strength-section__dots--top {
    top: 0;
    right: 0;
    width: 230px;
    height: 260px;
    opacity: 0.8;
    mask-image: radial-gradient(
        ellipse at top right,
        #000 25%,
        transparent 75%
    );
}

/* 左下 */

.strength-section__dots--left {
    bottom: 80px;
    left: 0;
    width: 230px;
    height: 250px;
    opacity: 0.8;
    mask-image: radial-gradient(
        ellipse at bottom left,
        #000 25%,
        transparent 75%
    );
}

/* 中央下 */

.strength-section__dots--bottom {
    bottom: -50px;
    left: 55%;
    width: 210px;
    height: 100px;
    opacity: 0.8;
    mask-image: radial-gradient(
        ellipse at bottom,
        #000 25%,
        transparent 75%
    );
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .strength-section__outer {
        width: calc(100% - 60px);
    }

    .strength-section__panel {
        padding: 55px 35px 65px;
        border-radius: 65px;
    }

    .strength-section__people {
        width: 190px;
        top: -115px;
        right: 35px;
    }

    .strength-section__list {
        gap: 30px;
    }

    .strength-section__image {
        height: 160px;
    }

    .strength-section__image img {
        max-width: 190px;
    }

    .strength-section__title {
        font-size: 19px;
    }

    .strength-section__text {
        font-size: 11px;
    }
}

/* ==========================================
   WORK FLOW SECTION - PC
========================================== */

.workflow-section {
    position: relative;
    width: 100%;
    padding: 80px 0 90px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.workflow-section *,
.workflow-section *::before,
.workflow-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.workflow-section__inner {
    position: relative;
    z-index: 1;
    width: calc(100% - 100px);
    max-width: 1380px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: 47% 53%;
    align-items: center;
}

/* ==========================================
   LEFT CONTENT
========================================== */

.workflow-section__content {
    position: relative;
    width: 100%;
    min-width: 0;
}

/* ==========================================
   HEADING
========================================== */

.workflow-section__heading {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 22px;
    margin-bottom: 55px;
}

/* 背面の薄緑の円 */

.workflow-section__heading::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -22px;
    left: -35px;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    background: #eaf8ec;
}

/* WORK FLOW */

.workflow-section__title {
    margin: 0;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(38px, 4vw, 62px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.045em;
    white-space: nowrap;
}

.workflow-section__title span {
    color: #009b00;
}

/* 日本語サブタイトル */

.workflow-section__subtitle {
    margin: 0;
    color: #111111;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

/* ==========================================
   FLOW LIST
========================================== */

.workflow-section__list {
    display: flex;
    flex-direction: column;
    gap: 55px;
    padding-left: 10px;
}

/* ==========================================
   FLOW ITEM
========================================== */

.workflow-section__item {
    width: 100%;
}

/* フロー見出し */

.workflow-section__item-title {
    margin: 0 0 14px;
    color: #000000;
    font-size: clamp(20px, 2vw, 27px);
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 0.01em;
}

/* フロー説明 */

.workflow-section__item-text {
    margin: 0;
    padding-left: 50px;
    color: #111111;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.01em;
}

/* ==========================================
   RIGHT IMAGE
========================================== */

.workflow-section__image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding-left: 40px;
}

.workflow-section__image img {
    display: block;
    width: 100%;
    max-width: 550px;
    height: auto;
    object-fit: contain;
}

/* ==========================================
   DOT DECORATION
========================================== */


/* ==========================================
   WORK FLOW DOT DECORATION
========================================== */

.workflow-section__dots {
    position: absolute;
    z-index: 0;

    left: -30px;
    bottom: 20px;

    width: 380px;
    height: 260px;

    background-image: radial-gradient(
        circle,
        #b8ecc2 3.5px,
        transparent 4px
    );

    background-size: 22px 22px;

    /* 楕円形にフェードアウト */
    -webkit-mask-image: radial-gradient(
        ellipse 70% 65% at center,
        #000 35%,
        transparent 100%
    );

    mask-image: radial-gradient(
        ellipse 70% 65% at center,
        #000 35%,
        transparent 100%
    );

    opacity: 0.55;
    pointer-events: none;
}


/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .workflow-section {
        padding: 65px 0 75px;
    }

    .workflow-section__inner {
        width: calc(100% - 60px);
        grid-template-columns: 52% 48%;
    }

    .workflow-section__heading {
        gap: 12px;
        margin-bottom: 40px;
    }

    .workflow-section__title {
        font-size: 42px;
    }

    .workflow-section__subtitle {
        font-size: 11px;
    }

    .workflow-section__list {
        gap: 35px;
    }

    .workflow-section__item-title {
        font-size: 19px;
    }

    .workflow-section__item-text {
        padding-left: 35px;
        font-size: 12px;
    }

    .workflow-section__image {
        padding-left: 20px;
    }
}

/* ==========================================
   PROMISES SECTION - PC
========================================== */

.promises-section {
    position: relative;
    width: 100%;
    padding: 65px 0 90px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.promises-section *,
.promises-section *::before,
.promises-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.promises-section__inner {
    position: relative;
    z-index: 1;
    width: calc(100% - 100px);
    max-width: 1200px;
    margin: 0 auto;
}

/* ==========================================
   SECTION HEADING
========================================== */

.promises-section__heading {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 35px;
}

/* 地球イラスト */

.promises-section__heading-icon {
    position: relative;
    z-index: 2;
    width: 65px;
    flex-shrink: 0;

    /* 地球を上に移動 */
    transform: translateY(-22px);
}
.promises-section__heading-icon::before {
    content: none;
}
.promises-section__heading-icon img {
    display: block;
    width: 100%;
    height: auto;
}

/* 見出しテキスト */

.promises-section__heading-text {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 3つの約束 */

.promises-section__subtitle {
    margin: 0 0 2px;
    color: #111111;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
}

/* PROMISES */

.promises-section__title {
    position: relative;
    isolation: isolate;
    margin: 0;
    color: #000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(35px, 3.5vw, 52px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.045em;
}
.promises-section__title::before {
    content: "";
    position: absolute;
    z-index: -1;

    width: 65px;
    height: 65px;

    /* 円を左下へ移動 */
    left: -34px;
    top: -12px;

    border-radius: 50%;
    background: #eaf8ec;
}

.promises-section__title span {
  color: #009b00;
}

/* ==========================================
   LEAD TEXT
========================================== */

.promises-section__lead {
    max-width: 650px;
    margin: 0 auto 65px;
    color: #111111;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.9;
    text-align: center;
}

/* ==========================================
   PROMISE LIST
========================================== */

.promises-section__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
}

/* ==========================================
   ITEM
========================================== */

.promises-section__item {
    min-width: 0;
}

/* ==========================================
   GREEN BORDER BOX
========================================== */

.promises-section__box {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 185px;
    padding: 28px 12px 20px;

    border: 11px solid #439e43;
    background: #ffffff;
}

/* ==========================================
   NUMBER
========================================== */

.promises-section__number {
    position: absolute;
    top: -37px;
    left: -22px;
    z-index: 2;

    color: #439e43;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 57px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
	    -webkit-text-stroke: 10px #ffffff;
    paint-order: stroke fill;
}

/* ==========================================
   ICON
========================================== */

.promises-section__icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 65px;
    height: 65px;
    margin-bottom: 5px;
}

.promises-section__icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ==========================================
   ENGLISH LABEL
========================================== */

.promises-section__en {
    margin: 0 0 4px;
    color: #008d00;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
}

/* ==========================================
   ITEM TITLE
========================================== */

.promises-section__item-title {
    margin: 0;
    color: #000000;
    font-size: clamp(19px, 1.8vw, 25px);
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
}

/* ==========================================
   DESCRIPTION
========================================== */

.promises-section__description {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 2px solid #111111;
}

.promises-section__description p {
    margin: 0;
    color: #111111;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

/* ==========================================
   DOT DECORATION - RIGHT BOTTOM
========================================== */

.promises-section__dots {
    position: absolute;
    z-index: 0;
    right: -35px;
    bottom: -20px;

    width: 230px;
    height: 180px;

    background-image: radial-gradient(
        circle,
        #b8ecc2 3px,
        transparent 3.5px
    );

    background-size: 20px 20px;
    opacity: 0.55;
    pointer-events: none;

    -webkit-mask-image: radial-gradient(
        ellipse at bottom right,
        #000 30%,
        transparent 80%
    );

    mask-image: radial-gradient(
        ellipse at bottom right,
        #000 30%,
        transparent 80%
    );
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .promises-section__inner {
        width: calc(100% - 60px);
    }

    .promises-section__list {
        gap: 25px;
    }

    .promises-section__box {
        min-height: 165px;
        border-width: 8px;
    }

    .promises-section__number {
        font-size: 45px;
        top: -28px;
        left: -15px;
    }

    .promises-section__icon {
        width: 50px;
        height: 50px;
    }

    .promises-section__item-title {
        font-size: 17px;
    }

    .promises-section__description p {
        font-size: 11px;
    }
}

/* ==========================================
   FAQ SECTION - PC
========================================== */

.faq-section {
    position: relative;
    width: 100%;
    min-height: 850px;
    padding: 55px 0 70px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.faq-section *,
.faq-section *::before,
.faq-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.faq-section__inner {
    position: relative;
    z-index: 2;
    width: calc(100% - 80px);
    max-width: 850px;
    margin: 0 auto;
}

/* ==========================================
   HEADING
========================================== */

.faq-section__heading {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto 60px;
}

/* 日本語タイトル */

.faq-section__subtitle {
    position: relative;
    z-index: 2;
    margin: 0 0 8px;
    color: #000000;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.4;
}

/* FAQ */

.faq-section__title {
    position: relative;
    z-index: 1;
    isolation: isolate;
    margin: 0;
    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 49px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.045em;
}

.faq-section__title span {
    color: #008f00;
}

/* Fの背面の薄緑の円 */

.faq-section__title::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 49px;
    height: 49px;
    top: -16px;
    left: -34px;
    border-radius: 50%;
    background: #eaf8ec;
}

/* ==========================================
   FAQ LIST
========================================== */

.faq-section__list {
    position: relative;
    width: 100%;
}

/* ==========================================
   FAQ ITEM
========================================== */

.faq-section__item {
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
}

/* ==========================================
   QUESTION
========================================== */

.faq-section__question {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 12px 15px 12px 115px;

    background: #edf5ed;
    border: none;
    border-bottom: 1px solid #a1cfa3;

    color: #008b00;
    cursor: pointer;
    list-style: none;

    transition: background-color 0.25s ease;
}

/* ブラウザ標準の三角マークを非表示 */

.faq-section__question::-webkit-details-marker {
    display: none;
}

.faq-section__question::marker {
    content: "";
}

.faq-section__question:hover {
    background: #e3f0e3;
}

.faq-section__question:focus-visible {
    outline: 2px solid #008b00;
    outline-offset: -3px;
}

/* 質問テキスト */

.faq-section__question-text {
    display: block;
    color: #008b00;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 0;
}

/* ==========================================
   ANSWER
========================================== */

.faq-section__answer {
    width: 100%;
    padding: 45px 45px 45px 115px;
    background: #ffffff;
}

.faq-section__answer p {
    margin: 0;
    color: #111111;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0;
}

/* 最後の質問は下線なし */

.faq-section__item:last-child .faq-section__question {
    border-bottom: none;
}

/* ==========================================
   LEFT TOP ILLUSTRATION
========================================== */

.faq-section__helmet {
    position: absolute;
    z-index: 1;
    top: 65px;
    left: max(5%, calc((100% - 1500px) / 2));
    width: 180px;
    pointer-events: none;
}

.faq-section__helmet img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ==========================================
   RIGHT BOTTOM ILLUSTRATION
========================================== */

.faq-section__house {
    position: absolute;
    z-index: 1;
    right: max(6%, calc((100% - 1500px) / 2));
    bottom: 95px;
    width: 220px;
    pointer-events: none;
}

.faq-section__house img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* ==========================================
   DOT DECORATION
========================================== */

.faq-section__dots {
    position: absolute;
    z-index: 0;
    pointer-events: none;

    background-image: radial-gradient(
        circle,
        #b9edc2 5px,
        transparent 5.5px
    );

    background-size: 25px 25px;
    opacity: 0.6;
}

/* 右上ドット */

.faq-section__dots--top {
    top: -30px;
    right: -40px;
    width: 330px;
    height: 320px;

    -webkit-mask-image: radial-gradient(
        ellipse 85% 80% at top right,
        #000 35%,
        transparent 100%
    );

    mask-image: radial-gradient(
        ellipse 85% 80% at top right,
        #000 35%,
        transparent 100%
    );
}

/* 左下ドット */

.faq-section__dots--bottom {
    left: -45px;
    bottom: -15px;
    width: 500px;
    height: 270px;

    -webkit-mask-image: radial-gradient(
        ellipse 75% 80% at center,
        #000 35%,
        transparent 100%
    );

    mask-image: radial-gradient(
        ellipse 75% 80% at center,
        #000 35%,
        transparent 100%
    );
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .faq-section {
        min-height: 750px;
        padding: 65px 0 160px;
    }

    .faq-section__inner {
        width: calc(100% - 100px);
        max-width: 750px;
    }

    .faq-section__helmet {
        width: 125px;
        top: 25px;
        left: 25px;
    }

    .faq-section__house {
        width: 155px;
        right: 25px;
        bottom: 45px;
    }

    .faq-section__question {
        padding-left: 65px;
    }

    .faq-section__question-text {
        font-size: 19px;
    }

    .faq-section__answer {
        padding: 35px 35px 35px 65px;
    }

    .faq-section__answer p {
        font-size: 19px;
    }

}

/* ==========================================
   FAQ ACCORDION ANIMATION
   PC / SP 共通
========================================== */

/* 回答エリア */
.faq-section__answer {
    overflow: hidden;
}

/* 質問行 */
.faq-section__question {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

/* 標準の矢印を非表示 */
.faq-section__question::-webkit-details-marker {
    display: none;
}

.faq-section__question::marker {
    content: "";
}

/* ホバー */
@media (hover: hover) {
    .faq-section__question:hover {
        background-color: #e3f0e3;
    }
}

/* 動きを抑える設定のユーザーにはアニメーションしない */
@media (prefers-reduced-motion: reduce) {
    .faq-section__answer {
        scroll-behavior: auto;
    }
}

/* ==========================================
   CONTACT SECTION - PC
========================================== */

.contact-section {
    position: relative;
    width: 100%;
    padding: 0 0 0;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.contact-section *,
.contact-section *::before,
.contact-section *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.contact-section__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: none;
    margin: 0;
}

/* ==========================================
   BACKGROUND VISUAL
========================================== */

.contact-section__visual {
    width: 100%;
    min-height: 730px;
    padding: 130px 30px 100px;

    background-image: url("../images/contact-city.png");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}

/* ==========================================
   WHITE PANEL
========================================== */

.contact-section__panel {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100%;
    max-width: 1000px;
    min-height: 500px;

    padding: 70px 65px;

    background: #ffffff;

    box-shadow: 0 0 22px rgba(0, 0, 0, 0.13);

    text-align: center;
}

/* ==========================================
   HEADING
========================================== */

.contact-section__heading {
    margin-bottom: 45px;
}

.contact-section__subtitle {
    margin: 0 0 12px;
    color: #000000;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.4;
}

.contact-section__title {
    margin: 0;
    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(32px, 3.5vw, 50px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.045em;
}

/* ==========================================
   DESCRIPTION
========================================== */

.contact-section__description {
    max-width: 720px;
    margin: 0 auto 45px;

    color: #000000;
    font-size: 17px;
    font-weight: 600;
    line-height: 2;
    letter-spacing: 0.01em;

    text-align: center;
}

/* ==========================================
   BUTTON
========================================== */

.contact-section__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 200px;
    min-height: 40px;
    padding: 8px 25px;

    background: #009900;
    border: 1px solid #009900;
    border-radius: 12px;

    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.contact-section__button:hover {
    background: #ffffff;
    color: #009900;
    transform: translateY(-2px);
}

.contact-section__button:focus-visible {
    outline: 3px solid #006b00;
    outline-offset: 4px;
}

/* ==========================================
   LEFT TOP DOTS
========================================== */

.contact-section__dots {
    position: absolute;
    z-index: 0;

    top: 0;
    left: -10px;

    width: 135px;
    height: 310px;

    background-image: radial-gradient(
        circle,
        #b9edc2 5px,
        transparent 5.5px
    );

    background-size: 26px 26px;
    opacity: 0.65;

    pointer-events: none;

    -webkit-mask-image: radial-gradient(
        ellipse 85% 80% at top left,
        #000 45%,
        transparent 100%
    );

    mask-image: radial-gradient(
        ellipse 85% 80% at top left,
        #000 45%,
        transparent 100%
    );
}

/* ==========================================
   PC ONLY
========================================== */

@media screen and (min-width: 768px) {

    .contact-section .pc-only {
        display: inline;
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .contact-section__inner {
        width: calc(100% - 60px);
    }

    .contact-section__visual {
        min-height: 600px;
        padding: 100px 25px 80px;
    }

    .contact-section__panel {
        max-width: 850px;
        min-height: 430px;
        padding: 55px 35px;
    }

    .contact-section__description {
        font-size: 14px;
    }

}

/* ==========================================
   CONTACT PANEL CENTER FIX
========================================== */

.contact-section__inner {
    width: 100%;
    max-width: none;
    margin: 0 auto;
}

.contact-section__visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;

    width: 100%;
}

/* 白い座布団を中央に配置 */
.contact-section__panel {
    width: 100%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    flex-shrink: 0;
}

/* ==========================================
   CONTACT PAGE - PC
========================================== */

.contact-page {
    position: relative;
    width: 100%;
    min-height: 1350px;
    padding: 85px 0 110px;
    background: #fff;
    overflow: hidden;
    isolation: isolate;
}

.contact-page *,
.contact-page *::before,
.contact-page *::after {
    box-sizing: border-box;
}

.contact-page__inner {
    position: relative;
    z-index: 2;
    width: calc(100% - 100px);
    max-width: 1180px;
    margin: 0 auto;
}

/* ==========================================
   HEADING
========================================== */

.contact-page__heading {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin: 0 auto 85px;
    text-align: center;
}

.contact-page__heading-center {
    position: relative;
    z-index: 2;
    width: 420px;
    max-width: 100%;
}

.contact-page__heading-en {
    margin: 0 0 5px;
    color: #008b00;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.2;
}

.contact-page__heading-title {
    margin: 0;
    color: #000;
    font-size: 31px;
    font-weight: 800;
    line-height: 1.4;
}

.contact-page__lead {
    margin: 15px auto 0;
    color: #111;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.9;
}

/* 観葉植物 */

.contact-page__plant {
    position: absolute;
    width: 70px;
    height: auto;
    right: calc(50% + 210px);
    top: 3px;
}

/* 作業員 */

.contact-page__worker {
    position: absolute;
    width: 90px;
    height: auto;
    left: calc(50% + 200px);
    top: 2px;
}

/* ==========================================
   FORM AREA
========================================== */

.contact-page__form-area {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 790px;
}

.contact-page__form-area .wpcf7 {
    width: 100%;
}

.contact-form {
    width: 100%;
}

/* 通常の入力行 */

.contact-form__row {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    column-gap: 20px;
    align-items: start;
    margin-bottom: 24px;
}

.contact-form__label {
    display: block;
    padding-top: 5px;
    color: #111;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.5;
}

.contact-form__field {
    width: 100%;
    min-width: 0;
}

.contact-form__field .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* 入力欄 */

.contact-form__input {
    display: block;
    width: 100%;
    height: 38px;
    padding: 6px 12px;
    border: 1px solid #222;
    border-radius: 0;
    background: #fff;
    color: #111;
    font-size: 15px;
    box-shadow: none;
    appearance: none;
}

.contact-form__input:focus,
.contact-form__textarea:focus {
    outline: 2px solid #008f00;
    outline-offset: 1px;
}

/* ==========================================
   CHECKBOXES
========================================== */

.contact-form__row--type {
    margin-top: 32px;
    margin-bottom: 65px;
}

.contact-form__row--type .contact-form__label {
    padding-top: 0;
}

.contact-form__checkboxes .wpcf7-list-item {
    margin: 0;
}

.contact-form__checkboxes .wpcf7-list-item-label {
    font-size: 12px;
    font-weight: 700;
}

.contact-form__row--type .wpcf7-checkbox {
    display: grid;
    grid-template-columns: repeat(4, 150px);
    column-gap: 20px;
    row-gap: 12px;
}

.contact-form__row--type .wpcf7-list-item label {
    display: inline-flex;
    gap: 7px;
    cursor: pointer;
}

.contact-form__row--type input[type="checkbox"],
.contact-form__agreement input[type="checkbox"] {
    width: 23px;
    height: 23px;
    margin: 0;
    flex-shrink: 0;
    accent-color: #008f00;
    cursor: pointer;
}

/* ==========================================
   MESSAGE
========================================== */

.contact-form__row--message {
    display: block;
    margin-bottom: 35px;
}

.contact-form__row--message .contact-form__label {
    margin-bottom: 10px;
    padding: 0;
}

.contact-form__row--message .contact-form__field {
    width: 100%;
    max-width: 500px;
}

.contact-form__textarea {
    display: block;
    width: 100%;
    height: 165px;
    min-height: 165px;
    padding: 12px;
    border: 1px solid #222;
    border-radius: 0;
    background: #fff;
    color: #111;
    font-size: 15px;
    resize: vertical;
}

/* ==========================================
   PRIVACY POLICY
========================================== */

.contact-form__privacy {
    width: 100%;
    max-width: 500px;
}

.contact-form__privacy-title {
    margin: 0 0 10px;
    color: #008b00;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.5;
}

.contact-form__privacy-scroll {
    width: 100%;
    height: 165px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 20px 16px;
    border: 1px solid #222;
    background: #fff;
    scrollbar-width: thin;
    scrollbar-color: #a7cda7 #f1f1f1;
}

.contact-form__privacy-scroll h4 {
    margin: 0 0 7px;
    color: #111;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.5;
}

.contact-form__privacy-scroll p {
    margin: 0 0 15px;
    color: #111;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.6;
}

.contact-form__agreement {
    margin-top: 22px;
    color: #111;
    font-size: 12px;
    font-weight: 700;
}

.contact-form__agreement .wpcf7-list-item {
    margin: 0;
}

.contact-form__agreement .wpcf7-list-item label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

/* ==========================================
   SUBMIT
========================================== */

.contact-form__submit {
    margin-top: 50px;
}

.contact-form__submit-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 110px;
    min-height: 37px;
    padding: 8px 15px;
    border: none;
    border-radius: 5px;
    background: #009900;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    transition: background-color .25s ease;
}

.contact-form__submit-button:hover {
    background: #007700;
}

.contact-form__submit-button:focus-visible {
    outline: 3px solid #006b00;
    outline-offset: 3px;
}

/* CF7 メッセージ */

.contact-form .wpcf7-not-valid-tip {
    margin-top: 5px;
    font-size: 12px;
}

.contact-page__form-area .wpcf7-response-output {
    margin: 20px 0 0;
    font-size: 13px;
}

/* ==========================================
   RIGHT BOTTOM PHOTO
========================================== */

.contact-page__photo {
    position: absolute;
    right: 0;
    bottom: 45px;
    width: 240px;
    overflow: hidden;
    border-radius: 28px;
}

.contact-page__photo img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.5 / 1;
    object-fit: cover;
}

/* ==========================================
   DECORATIONS
========================================== */

.contact-page__decoration {
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

/* 右上 */

.contact-page__decoration--top {
    top: 120px;
    right: -65px;
    width: 350px;
    height: 370px;
    border-radius: 50%;
    background-image: radial-gradient(
        circle,
        #b9edc2 4px,
        transparent 4.5px
    );
    background-size: 17px 17px;
    opacity: .65;
    -webkit-mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 75%
    );
    mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 75%
    );
}

/* 左下 */

.contact-page__decoration--bottom {
    left: -100px;
    bottom: 110px;
    width: 300px;
    height: 320px;
    border-radius: 50%;
    background-image: radial-gradient(
        circle,
        #b9edc2 3px,
        transparent 3.5px
    );
    background-size: 14px 14px;
    opacity: .65;
    -webkit-mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 78%
    );
    mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 78%
    );
}

/* 薄緑の円 */

.contact-page__decoration--top::after,
.contact-page__decoration--bottom::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: #eaf8ec;
    opacity: .9;
}

.contact-page__decoration--top::after {
    right: -20px;
    bottom: -25px;
}

.contact-page__decoration--bottom::after {
    left: 30px;
    bottom: -25px;
}

/* ==========================================
   INFORMATION PAGE - PC
========================================== */

.information-page {
    position: relative;
    width: 100%;
    min-height: 650px;
    padding: 100px 0 120px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.information-page *,
.information-page *::before,
.information-page *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.information-page__inner {
    position: relative;
    z-index: 2;
    width: calc(100% - 130px);
    max-width: 1180px;
    margin: 0 auto;
}

/* ==========================================
   HEADING
========================================== */

.information-page__heading {
    width: 100%;
    padding-bottom: 20px;
    border-bottom: 1px solid #111111;
    margin-bottom: 50px;
}

.information-page__heading-content {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
}

.information-page__title {
    position: relative;
    isolation: isolate;
    margin: 0;

    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 4vw, 54px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.045em;
}

/* Iのみ緑色 */

.information-page__title span {
    color: #009900;
}

/* Iの背面の薄緑円 */

.information-page__title::before {
    content: "";
    position: absolute;
    z-index: -1;

    width: 58px;
    height: 58px;
    top: -14px;
    left: -30px;

    border-radius: 50%;
    background: #eaf8ec;
}

.information-page__subtitle {
    margin-top: 12px;
    color: #111111;
    font-size: 15px;
    font-weight: 800;
    white-space: nowrap;
}

/* 見出し右のイラスト */

.information-page__heading-image {
    display: block;
    width: 78px;
    height: auto;
    margin-top: 4px;
    object-fit: contain;
}

/* ==========================================
   CONTENT
========================================== */

.information-page__content {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 65px;
    align-items: start;
}

/* ==========================================
   CATEGORY MENU
========================================== */

.information-page__categories {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.information-page__category {
    display: block;
    width: 100%;
    padding: 10px 0;

    border-bottom: 1px solid #777777;

    color: #111111;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;

    transition: color .25s ease;
}

.information-page__category:hover,
.information-page__category.is-active {
    color: #008f00;
}

/* ==========================================
   POST LIST
========================================== */

.information-page__main {
    width: 100%;
    min-width: 0;
}

.information-page__list {
    width: 100%;
}

.information-page__item {
    width: 100%;
    border-bottom: 1px solid #444444;
}

.information-page__item-link {
    display: flex;
    align-items: center;
    gap: 12px;

    width: 100%;
    min-height: 48px;
    padding: 12px 8px;

    color: #111111;
    text-decoration: none;

    transition: color .25s ease;
}

.information-page__item-link:hover {
    color: #008f00;
}

.information-page__date {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.information-page__post-category {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.information-page__post-title {
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.6;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================================
   PAGINATION
========================================== */

.information-page__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 45px;
}

.information-page__pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    height: 34px;
    padding: 4px 8px;

    border: 1px solid #d5e6d5;
    border-radius: 4px;

    color: #111111;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.information-page__pagination .page-numbers.current,
.information-page__pagination .page-numbers:hover {
    background: #009900;
    border-color: #009900;
    color: #ffffff;
}

/* ==========================================
   EMPTY
========================================== */

.information-page__empty {
    padding: 20px 0;
    color: #444444;
    font-size: 14px;
}

/* ==========================================
   RIGHT TOP DOTS
========================================== */

.information-page__dots {
    position: absolute;
    z-index: 0;

    top: 100px;
    right: -45px;

    width: 360px;
    height: 380px;

    background-image: radial-gradient(
        circle,
        #b9edc2 4px,
        transparent 4.5px
    );

    background-size: 17px 17px;
    opacity: .65;

    pointer-events: none;

    -webkit-mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 78%
    );

    mask-image: radial-gradient(
        ellipse at center,
        #000 48%,
        transparent 78%
    );
}

/* 薄緑の円 */

.information-page__dots::after {
    content: "";
    position: absolute;
    right: -10px;
    bottom: -25px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: #eaf8ec;
    opacity: .8;
}

/* ==========================================
   ABOUT PAGE FV - PC
========================================== */

.about-page {
    width: 100%;
    background: #ffffff;
}

.about-page-fv {
    position: relative;
    width: 100%;
    padding: 100px 0 120px;
    background: #ffffff;
    overflow: hidden;
}

.about-page-fv *,
.about-page-fv *::before,
.about-page-fv *::after {
    box-sizing: border-box;
}

/* ==========================================
   INNER
========================================== */

.about-page-fv__inner {
    position: relative;
    width: calc(100% - 100px);
    max-width: 1400px;
    min-height: 570px;
    margin: 0 auto;
}

/* ==========================================
   CENTER CONTENT
========================================== */

.about-page-fv__content {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100%;
    max-width: 900px;
    margin: 0 auto;

    padding-top: 65px;

    text-align: center;
}

/* ==========================================
   TITLE
========================================== */

.about-page-fv__title {
    position: relative;
    margin: 0;

    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(43px, 4.3vw, 72px);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.045em;

    white-space: nowrap;
}

/* LとOを緑色 */

.about-page-fv__title-l,
.about-page-fv__title-o {
    color: #008f00;
}

/* Lの背面の薄緑円 */

.about-page-fv__title-l {
    position: relative;
    z-index: 1;
}

.about-page-fv__title-l::before {
    content: "";
    position: absolute;
    z-index: -1;

    width: 80px;
    height: 80px;

    top: -22px;
    left: -45px;

    background: #eaf8ec;
    border-radius: 50%;
}

/* について */

.about-page-fv__title-ja {
    color: #000000;
    font-family: sans-serif;
    font-size: 0.72em;
    font-weight: 800;
    letter-spacing: -0.06em;
}

/* ==========================================
   DESCRIPTIONS
========================================== */

.about-page-fv__descriptions {
    width: 100%;
    max-width: 640px;
    margin: 35px auto 0;
}

.about-page-fv__description {
    margin: 0;

    color: #111111;
    font-size: 16px;
    font-weight: 700;
    line-height: 2.1;
    letter-spacing: 0.02em;

    text-align: center;
}

.about-page-fv__description + .about-page-fv__description {
    margin-top: 35px;
}

/* ==========================================
   ILLUSTRATIONS
========================================== */

.about-page-fv__illustration {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.about-page-fv__illustration img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* 左上：作業員 */

.about-page-fv__illustration--worker {
    top: 20px;
    left: 15px;
    width: 205px;
}

/* 右上：ビル */

.about-page-fv__illustration--building {
    top: 15px;
    right: 15px;
    width: 230px;
}

/* 左下：設計図 */

.about-page-fv__illustration--blueprint {
    bottom: 0;
    left: 15px;
    width: 240px;
}

/* 右下：打ち合わせ */

.about-page-fv__illustration--meeting {
    bottom: 0;
    right: 15px;
    width: 290px;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .about-page-fv__inner {
        width: calc(100% - 60px);
        min-height: 530px;
    }

    .about-page-fv__content {
        padding-top: 90px;
    }

    .about-page-fv__title {
        font-size: clamp(38px, 4.8vw, 54px);
    }

    .about-page-fv__description {
        font-size: 13px;
    }

    .about-page-fv__illustration--worker {
        width: 150px;
    }

    .about-page-fv__illustration--building {
        width: 165px;
    }

    .about-page-fv__illustration--blueprint {
        width: 170px;
    }

    .about-page-fv__illustration--meeting {
        width: 200px;
    }

}

/* ==========================================
   COMPANY PROMISES - PC
========================================== */

.company-promises {
    position: relative;
    width: 100%;
    padding: 55px 0 100px;
    background: #fff;
}

.company-promises *,
.company-promises *::before,
.company-promises *::after {
    box-sizing: border-box;
}

.company-promises__wrap {
    position: relative;
    width: calc(100% - 160px);
    max-width: 1200px;
    margin: 0 auto;
}

/* ==========================================
   GREEN PANEL
========================================== */

.company-promises__panel {
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: 55px 70px 85px;
    border-radius: 55px;
    background: #2d9c3c;
    overflow: hidden;
}

.company-promises__inner {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
}

/* ==========================================
   TITLE
========================================== */

.company-promises__title {
    margin: 0 0 50px;
    color: #fff;
    font-size: 43px;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
}

/* ==========================================
   ACCORDION
========================================== */

.company-promises__accordion {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.company-promises__item {
    position: relative;
    width: 100%;
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
}

.company-promises__item-heading {
    margin: 0;
    padding: 0;
}

.company-promises__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    width: 100%;
    min-height: 102px;
    padding: 17px 32px 17px 50px;
    border: none;
    background: transparent;
    color: #111;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.company-promises__item-title {
    font-size: 25px;
    font-weight: 800;
    line-height: 1.5;
}

/* ==========================================
   PLUS / MINUS BUTTON
========================================== */

.company-promises__toggle {
    position: relative;
    display: block;
    width: 82px;
    height: 82px;
    flex: 0 0 82px;
    border-radius: 50%;
    background: #4ba447;
    transition: background-color .3s ease;
}

.company-promises__toggle::before,
.company-promises__toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: #fff;
    border-radius: 2px;
    transform: translate(-50%, -50%);
    transition: transform .3s ease, opacity .3s ease;
}

.company-promises__toggle::before {
    width: 35px;
    height: 5px;
}

.company-promises__toggle::after {
    width: 5px;
    height: 35px;
}

.company-promises__item.is-open .company-promises__toggle::after {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(90deg);
}

.company-promises__trigger:hover .company-promises__toggle {
    background: #388f37;
}

.company-promises__trigger:focus-visible {
    outline: 3px solid #175d1d;
    outline-offset: -5px;
}

/* ==========================================
   ACCORDION BODY
========================================== */

.company-promises__body {
    height: 0;
    overflow: hidden;
    transition: height .42s cubic-bezier(.22, 1, .36, 1);
}

.company-promises__item.is-open .company-promises__body {
    height: auto;
}

.company-promises__body-inner {
    padding: 0 130px 40px 50px;
}

.company-promises__body-inner p {
    margin: 0;
    color: #111;
    font-size: 16px;
    font-weight: 700;
    line-height: 2;
}

/* ==========================================
   DOT PATTERNS
========================================== */

.company-promises__dots {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    background-image: radial-gradient(
        circle,
        rgba(225, 255, 225, .75) 3.5px,
        transparent 4px
    );
    background-size: 16px 16px;
}

/* 右上 */

.company-promises__dots--top {
    top: -65px;
    right: 55px;
    width: 300px;
    height: 180px;
    border-radius: 50%;
    transform: rotate(12deg);
}

/* 左中央 */

.company-promises__dots--left {
    top: 295px;
    left: -55px;
    width: 330px;
    height: 310px;
    border-radius: 50%;
}

/* 右下 */

.company-promises__dots--right {
    right: -65px;
    bottom: -65px;
    width: 300px;
    height: 330px;
    border-radius: 50%;
}

/* ==========================================
   TRANSLUCENT CIRCLES
========================================== */

.company-promises__circle {
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .20);
    pointer-events: none;
}

.company-promises__circle--top {
    top: -60px;
    right: -5px;
    width: 170px;
    height: 170px;
}

.company-promises__circle--left {
    bottom: 150px;
    left: -90px;
    width: 180px;
    height: 180px;
}

/* ==========================================
   OUTSIDE ILLUSTRATIONS
========================================== */

.company-promises__illust {
    position: absolute;
    z-index: 4;
    display: block;
    height: auto;
    pointer-events: none;
    object-fit: contain;
}

/* 左上：チェックリスト */

.company-promises__illust--check {
    top: 35px;
    left: 45px;
    width: 140px;
}

/* 左中央：現場確認 */

.company-promises__illust--inspection {
    top: 190px;
    left: -175px;
    width: 150px;
}

/* 左下：塗装道具 */

.company-promises__illust--tools {
    bottom: -90px;
    left: -175px;
    width: 155px;
}

/* 右上：ヘルメットと図面 */

.company-promises__illust--planning {
    top: 35px;
    right: -180px;
    width: 170px;
}

/* 右下：オフィス */

.company-promises__illust--office {
    bottom: 0;
    right: -180px;
    width: 170px;
}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .company-promises__wrap {
        width: calc(100% - 100px);
    }

    .company-promises__panel {
        padding: 50px 40px 70px;
    }

    .company-promises__title {
        font-size: 35px;
    }

    .company-promises__item-title {
        font-size: 20px;
    }

    .company-promises__trigger {
        padding-left: 35px;
    }

    .company-promises__body-inner {
        padding-left: 35px;
        padding-right: 80px;
    }

    .company-promises__illust--inspection,
    .company-promises__illust--tools {
        left: -85px;
        width: 70px;
    }

    .company-promises__illust--planning,
    .company-promises__illust--office {
        right: -85px;
        width: 70px;
    }

}

/* ==========================================
   COMPANY PROMISES
   横スクロール防止
========================================== */

.company-promises {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

/* イラストのサイズを少し調整 */
.company-promises__illust--check {
    width: 120px;
}

.company-promises__illust--inspection {
    width: 120px;
}

.company-promises__illust--tools {
    width: 125px;
}

.company-promises__illust--planning {
    width: 140px;
}

.company-promises__illust--office {
    width: 140px;
}

/* ==========================================
   SP
========================================== */

@media screen and (max-width: 767px) {

    .company-promises {
        overflow-x: clip;
    }

    .company-promises__illust--check {
        width: 55px;
    }

    .company-promises__illust--inspection {
        width: 55px;
    }

    .company-promises__illust--tools {
        width: 55px;
    }

    .company-promises__illust--planning {
        width: 60px;
    }

    .company-promises__illust--office {
        width: 60px;
    }

}

/* ==========================================
   COMPANY PHILOSOPHY - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .company-philosophy {
        position: relative;
        width: 100%;
        padding: 45px 0 65px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-philosophy *,
    .company-philosophy *::before,
    .company-philosophy *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-philosophy__inner {
        position: relative;
        z-index: 2;
        width: calc(100% - 100px);
        max-width: 1200px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-philosophy__heading {
        display: flex;
        align-items: baseline;
        gap: 18px;
        margin-bottom: 45px;
    }

    /* Philosophy */

    .company-philosophy__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(40px, 4vw, 58px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    /* 緑色のP */

    .company-philosophy__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Pの背面の薄緑色の円 */

    .company-philosophy__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -16px;
        left: -40px;

        width: 60px;
        height: 60px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 企業理念 */

    .company-philosophy__subtitle {
        margin: 0;
        color: #000000;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.4;
    }

    /* ======================================
       CONTENT - 2 COLUMNS
    ====================================== */

    .company-philosophy__content {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: center;
        gap: 45px;
    }

    /* ======================================
       LEFT TEXT
    ====================================== */

    .company-philosophy__text {
        width: 100%;
        min-width: 0;
    }

    /* 大見出し */

    .company-philosophy__lead {
        margin: 0 0 30px;

        color: #000000;
        font-size: clamp(20px, 2vw, 25px);
        font-weight: 800;
        line-height: 1.4;
        letter-spacing: 0;
    }

    /* 本文エリア */

    .company-philosophy__body {
        width: 100%;
        max-width: 510px;
    }

    .company-philosophy__body p {
        margin: 0 0 18px;

        color: #111111;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.7;
        letter-spacing: 0;
    }

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

    /* ======================================
       RIGHT ILLUSTRATION
    ====================================== */

    .company-philosophy__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .company-philosophy__visual img {
        display: block;
        width: 100%;
        max-width: 430px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .company-philosophy__dots {
        position: absolute;
        z-index: 0;

        top: 140px;
        right: -55px;

        width: 210px;
        height: 320px;

        background-image: radial-gradient(
            circle,
            #b9edc2 3px,
            transparent 3.5px
        );

        background-size: 18px 18px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );
    }

    /* ======================================
       RIGHT BOTTOM CIRCLE
    ====================================== */

    .company-philosophy__circle {
        position: absolute;
        z-index: 0;

        right: -45px;
        bottom: 45px;

        width: 125px;
        height: 125px;

        border-radius: 50%;
        background: #eaf8ec;

        pointer-events: none;
    }

}

/* ==========================================
   TABLET
   768px - 1100px
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .company-philosophy__inner {
        width: calc(100% - 70px);
    }

    .company-philosophy__heading {
        margin-bottom: 35px;
    }

    .company-philosophy__title {
        font-size: 45px;
    }

    .company-philosophy__subtitle {
        font-size: 16px;
    }

    .company-philosophy__content {
        gap: 30px;
    }

    .company-philosophy__lead {
        margin-bottom: 25px;
        font-size: 20px;
    }

    .company-philosophy__body p {
        margin-bottom: 15px;
        font-size: 12px;
        line-height: 1.7;
    }

    .company-philosophy__visual img {
        max-width: 350px;
    }

    .company-philosophy__dots {
        width: 160px;
        height: 250px;
    }

}

/* ==========================================
   COMPANY MESSAGE - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .company-message {
        position: relative;
        width: 100%;
        padding: 65px 0 90px;
        background: #ffffff;
    }

    .company-message *,
    .company-message *::before,
    .company-message *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-message__inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: stretch;
        gap: 75px;

        width: calc(100% - 100px);
        max-width: 1200px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .company-message__content {
        position: relative;
        min-width: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-message__heading {
        display: flex;
        align-items: baseline;
        gap: 18px;
        margin-bottom: 55px;
    }

    .company-message__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(40px, 4vw, 58px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    /* 緑色のM */

    .company-message__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Mの背面の薄緑円 */

    .company-message__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -16px;
        left: -30px;

        width: 80px;
        height: 80px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 代表メッセージ */

    .company-message__subtitle {
        margin: 0;
        color: #000000;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       MAIN HEADING
    ====================================== */

    .company-message__lead {
        margin: 0 0 35px;

        color: #000000;
        font-size: clamp(20px, 2vw, 25px);
        font-weight: 800;
        line-height: 1.4;
    }

    /* ======================================
       MESSAGE BODY
    ====================================== */

    .company-message__body {
        width: 100%;
        max-width: 510px;
    }

    .company-message__body p {
        margin: 0 0 25px;

        color: #111111;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.75;
        letter-spacing: 0;
    }

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

    /* ======================================
       RIGHT STICKY AREA
    ====================================== */

    .company-message__visual {
        position: relative;
        min-width: 0;
        align-self: stretch;
    }

    .company-message__sticky {
        position: sticky;
        top: 120px;

        display: flex;
        align-items: flex-start;
        justify-content: center;

        width: 100%;
        padding-top: 10px;
    }

    .company-message__sticky img {
        display: block;
        width: 100%;
        max-width: 350px;
        height: auto;
        object-fit: contain;
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .company-message__inner {
        width: calc(100% - 70px);
        gap: 35px;
    }

    .company-message__title {
        font-size: 45px;
    }

    .company-message__subtitle {
        font-size: 15px;
    }

    .company-message__lead {
        font-size: 20px;
    }

    .company-message__body p {
        font-size: 12px;
    }

    .company-message__sticky img {
        max-width: 270px;
    }

}

/* ==========================================
   COMPANY CITY - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .company-city {
        position: relative;
        width: 100%;
        padding: 35px 0 70px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-city *,
    .company-city *::before,
    .company-city *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-city__inner {
        position: relative;
        z-index: 2;

        width: calc(100% - 100px);
        max-width: 1400px;
        margin: 0 auto;
    }

    /* ======================================
       CITY ILLUSTRATION
    ====================================== */

    .company-city__visual {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        margin: 0 auto;
    }

    .company-city__visual img {
        display: block;
        width: 100%;
        max-width: 1250px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .company-city__dots {
        position: absolute;
        z-index: 0;

        right: -75px;
        bottom: -100px;

        width: 450px;
        height: 320px;

        background-image: radial-gradient(
            circle,
            #b9edc2 5px,
            transparent 5.5px
        );

        background-size: 25px 25px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .company-city {
        padding: 30px 0 55px;
    }

    .company-city__inner {
        width: calc(100% - 70px);
    }

    .company-city__visual img {
        max-width: 950px;
    }

    .company-city__dots {
        right: -60px;
        bottom: -70px;
        width: 320px;
        height: 240px;
        background-size: 20px 20px;
    }

}

/* ==========================================
   COMPANY PROFILE - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .company-profile {
        position: relative;
        width: 100%;
        padding: 65px 0 95px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-profile *,
    .company-profile *::before,
    .company-profile *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
       画面中央に配置
    ====================================== */

    .company-profile__inner {
        position: relative;
        z-index: 2;

        width: calc(100% - 100px);
        max-width: 1000px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-profile__heading {
        display: flex;
        align-items: baseline;
        gap: 18px;
        margin-bottom: 55px;
    }

    /* Company */

    .company-profile__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(40px, 4vw, 58px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    /* 緑色のC */

    .company-profile__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Cの背面の薄緑円 */

    .company-profile__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -16px;
        left: -30px;

        width: 80px;
        height: 80px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 企業概要 */

    .company-profile__subtitle {
        margin: 0;
        color: #000000;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       COMPANY LIST
    ====================================== */

    .company-profile__list {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto;
        padding: 0;
    }

    /* ======================================
       ROW
    ====================================== */

    .company-profile__row {
        display: grid;
        grid-template-columns: 230px minmax(0, 1fr);
        align-items: start;
        gap: 45px;

        width: 100%;
        padding: 23px 5px;

        border-bottom: 1px dashed #555555;
    }

    /* 項目名 */

    .company-profile__row dt {
        margin: 0;
        color: #111111;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.8;
    }

    /* 内容 */

    .company-profile__row dd {
        min-width: 0;
        margin: 0;

        color: #111111;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.85;
        overflow-wrap: anywhere;
    }

    /* 電話番号リンク */

    .company-profile__row dd a {
        color: inherit;
        text-decoration: none;
    }

    .company-profile__row dd a:hover {
        color: #008f00;
    }

    /* ======================================
       TOP RIGHT DOTS
    ====================================== */

    .company-profile__dots {
        position: absolute;
        z-index: 0;
        pointer-events: none;

        background-image: radial-gradient(
            circle,
            #b9edc2 3px,
            transparent 3.5px
        );

        background-size: 17px 17px;
        opacity: 0.6;
    }

    .company-profile__dots--top {
        top: -65px;
        right: -35px;

        width: 290px;
        height: 240px;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 80% at top right,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 80% at top right,
            #000 40%,
            transparent 100%
        );
    }

    /* ======================================
       BOTTOM LEFT DOTS
    ====================================== */

    .company-profile__dots--bottom {
        left: -45px;
        bottom: -100px;

        width: 330px;
        height: 190px;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at bottom left,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at bottom left,
            #000 40%,
            transparent 100%
        );
    }

    /* ======================================
       TOP RIGHT CIRCLE
    ====================================== */

    .company-profile__circle {
        position: absolute;
        z-index: 0;

        top: 65px;
        right: -65px;

        width: 200px;
        height: 200px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .company-profile__inner {
        width: calc(100% - 70px);
    }

    .company-profile__heading {
        margin-bottom: 40px;
    }

    .company-profile__title {
        font-size: 45px;
    }

    .company-profile__subtitle {
        font-size: 16px;
    }

    .company-profile__row {
        grid-template-columns: 180px minmax(0, 1fr);
        gap: 30px;
        padding: 20px 5px;
    }

    .company-profile__row dt,
    .company-profile__row dd {
        font-size: 13px;
    }

}

/* ==========================================
   COMPANY PROFILE MAP - PC
========================================== */

@media screen and (min-width: 768px) {

    .company-profile__map {
        position: relative;
        width: 100%;
        max-width: 850px;
        height: 400px;
        margin: 65px auto 0;
        overflow: hidden;
    }

    .company-profile__map iframe {
        display: block;
        width: 100%;
        height: 100%;
        border: none;
    }

}

/* ==========================================
   SERVICE FV - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .service-fv {
        position: relative;
        width: 100%;
        min-height: 400px;
        padding: 110px 0 90px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-fv *,
    .service-fv *::before,
    .service-fv *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-fv__inner {
        position: relative;
        z-index: 2;

        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
        align-items: center;
        gap: 55px;

        width: calc(100% - 100px);
        max-width: 1400px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-fv__content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        min-width: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .service-fv__heading {
        display: flex;
        align-items: baseline;
        gap: 25px;
        margin-bottom: 38px;
    }

    /* SERVICE */

    .service-fv__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(48px, 5vw, 75px);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.055em;
        white-space: nowrap;
    }

    /* GREEN S */

    .service-fv__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* LIGHT GREEN CIRCLE */

    .service-fv__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -15px;
        left: -30px;

        width: 70px;
        height: 70px;

        border-radius: 50%;
        background: #eaf8ec;
        pointer-events: none;
    }

    /* 事業内容 */

    .service-fv__subtitle {
        margin: 0;
        color: #111111;
        font-size: 17px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-fv__description {
        width: 100%;
        max-width: 560px;
        margin: 0 0 55px;

        color: #111111;
        font-size: 15px;
        font-weight: 700;
        line-height: 2;
        letter-spacing: 0.02em;
    }

    /* ======================================
       CONTACT BUTTON
    ====================================== */

    .service-fv__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: center;

        min-width: 170px;
        min-height: 45px;
        padding: 10px 28px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.4;
        text-decoration: none;

        transition:
            background-color 0.3s ease,
            color 0.3s ease,
            transform 0.3s ease;
    }

    .service-fv__button:hover {
        background: #ffffff;
        color: #009900;
        transform: translateY(-2px);
    }

    .service-fv__button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }

    /* ======================================
       RIGHT VISUAL
    ====================================== */

    .service-fv__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-fv__visual img {
        display: block;
        width: 100%;
        max-width: 640px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .service-fv__dots {
        position: absolute;
        z-index: 0;

        top: 30px;
        right: -80px;

        width: 460px;
        height: 520px;

        background-image: radial-gradient(
            circle,
            #b9edc2 5px,
            transparent 5.5px
        );

        background-size: 25px 25px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );
    }

}

/* ==========================================
   SERVICE FV - TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .service-fv {
        min-height: 520px;
        padding: 85px 0 70px;
    }

    .service-fv__inner {
        width: calc(100% - 70px);
        gap: 30px;
    }

    .service-fv__heading {
        gap: 15px;
        margin-bottom: 28px;
    }

    .service-fv__title {
        font-size: clamp(40px, 5vw, 55px);
    }

    .service-fv__title span::before {
        width: 75px;
        height: 75px;
        top: -18px;
        left: -20px;
    }

    .service-fv__subtitle {
        font-size: 14px;
    }

    .service-fv__description {
        font-size: 13px;
        margin-bottom: 35px;
    }

    .service-fv__visual img {
        max-width: 500px;
    }

    .service-fv__dots {
        right: -70px;
        width: 350px;
        height: 430px;
        background-size: 20px 20px;
    }

}

/* ==========================================
   SERVICE CITY - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* SECTION */

    .service-city {
        position: relative;
        width: 100%;
        padding: 35px 0 75px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-city *,
    .service-city *::before,
    .service-city *::after {
        box-sizing: border-box;
    }

    /* INNER */

    .service-city__inner {
        position: relative;
        z-index: 2;
        width: calc(100% - 100px);
        max-width: 1400px;
        margin: 0 auto;
    }

    /* IMAGE */

    .service-city__visual {
        width: 100%;
        height: 300px;
        margin: 0 auto;
        overflow: hidden;
        border-radius: 160px;
    }

    .service-city__visual img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    /* LEFT DOTS */

    .service-city__dots {
        position: absolute;
        z-index: 0;
        left: -65px;
        bottom: -25px;

        width: 400px;
        height: 290px;

        background-image: radial-gradient(
            circle,
            #b9edc2 5px,
            transparent 5.5px
        );

        background-size: 25px 25px;
        opacity: 0.6;
        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at bottom left,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at bottom left,
            #000 45%,
            transparent 100%
        );
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .service-city__inner {
        width: calc(100% - 70px);
    }

    .service-city__visual {
        height: 240px;
        border-radius: 130px;
    }

    .service-city__dots {
        width: 300px;
        height: 230px;
        background-size: 20px 20px;
    }

}

/* ==========================================
   SERVICE DETAIL 01 - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .service-detail--01 {
        position: relative;
        width: 100%;
        padding: 75px 0 90px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-detail--01 *,
    .service-detail--01 *::before,
    .service-detail--01 *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-detail--01 .service-detail__inner {
        position: relative;
        z-index: 2;

        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
        align-items: center;
        gap: 75px;

        width: calc(100% - 100px);
        max-width: 1250px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-detail--01 .service-detail__content {
        position: relative;
        min-width: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .service-detail--01 .service-detail__heading {
        position: relative;
        margin-bottom: 42px;
    }

    /* Service01 */

    .service-detail--01 .service-detail__number {
        margin: 0 0 12px;

        color: #008f00;
        font-family: Arial, sans-serif;
        font-size: 25px;
        font-weight: 800;
        line-height: 1.2;
    }

    /* 現場監理事業 */

    .service-detail--01 .service-detail__title {
        margin: 0;

        color: #000000;
        font-size: clamp(32px, 3.4vw, 46px);
        font-weight: 800;
        line-height: 1.35;
        letter-spacing: 0.02em;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-detail--01 .service-detail__description {
        width: 100%;
        max-width: 570px;

        color: #111111;
        font-size: 15px;
        font-weight: 700;
        line-height: 2;
        letter-spacing: 0.01em;
    }

    .service-detail--01 .service-detail__description p {
        margin: 0 0 25px;
    }

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

    /* ======================================
       RIGHT IMAGE
    ====================================== */

    .service-detail--01 .service-detail__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-detail--01 .service-detail__visual img {
        display: block;
        width: 100%;
        max-width: 540px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       LEFT DOT DECORATION
    ====================================== */

    .service-detail--01 .service-detail__dots {
        position: absolute;
        z-index: 0;

        top: -15px;
        left: -45px;

        width: 390px;
        height: 330px;

        background-image: radial-gradient(
            circle,
            #b9edc2 5px,
            transparent 5.5px
        );

        background-size: 25px 25px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at top left,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at top left,
            #000 45%,
            transparent 100%
        );
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .service-detail--01 {
        padding: 60px 0 75px;
    }

    .service-detail--01 .service-detail__inner {
        width: calc(100% - 70px);
        gap: 40px;
    }

    .service-detail--01 .service-detail__number {
        font-size: 21px;
    }

    .service-detail--01 .service-detail__title {
        font-size: 34px;
    }

    .service-detail--01 .service-detail__description {
        font-size: 13px;
    }

    .service-detail--01 .service-detail__visual img {
        max-width: 440px;
    }

    .service-detail--01 .service-detail__dots {
        width: 300px;
        height: 260px;
        background-size: 20px 20px;
    }

}

/* ==========================================
   SERVICE 01 FEATURES - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .service-features--01 {
        position: relative;
        width: 100%;
        padding: 35px 0 85px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-features--01 *,
    .service-features--01 *::before,
    .service-features--01 *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-features--01 .service-features__inner {
        position: relative;
        z-index: 2;

        display: flex;
        flex-direction: column;
        gap: 75px;

        width: calc(100% - 100px);
        max-width: 1250px;
        margin: 0 auto;
    }

    /* ======================================
       EACH FEATURE
    ====================================== */

    .service-features--01 .service-features__item {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        align-items: center;
        gap: 95px;

        width: 100%;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-features--01 .service-features__content {
        width: 100%;
        min-width: 0;
    }

    /* ======================================
       HEADING + GREEN LINE
    ====================================== */

    .service-features--01 .service-features__heading {
        display: flex;
        align-items: center;
        gap: 25px;
        width: 100%;
        margin-bottom: 24px;
    }

    .service-features--01 .service-features__title {
        flex-shrink: 0;
        margin: 0;

        color: #008f00;
        font-size: 23px;
        font-weight: 800;
        line-height: 1.3;
    }

    .service-features--01 .service-features__line {
        display: block;
        flex: 1;
        height: 1px;
        background: #299c37;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-features--01 .service-features__description {
        width: 100%;
        color: #111111;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.95;
        letter-spacing: 0.01em;
    }

    .service-features--01 .service-features__description p {
        margin: 0 0 22px;
    }

    .service-features--01 .service-features__description p:last-child {
        margin-bottom: 0;
    }

    /* ======================================
       RIGHT IMAGE
    ====================================== */

    .service-features--01 .service-features__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-features--01 .service-features__visual img {
        display: block;
        width: 100%;
        max-width: 400px;
        max-height: 255px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT ELLIPSE
    ====================================== */

    .service-features--01 .service-features__ellipse {
        position: absolute;
        z-index: 0;

        right: -125px;
        bottom: 110px;

        width: 300px;
        height: 410px;

        border-radius: 50%;
        background: #eaf8ec;
        opacity: 0.8;
        pointer-events: none;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .service-features--01 .service-features__dots {
        position: absolute;
        z-index: 1;

        right: -70px;
        bottom: 150px;

        width: 470px;
        height: 440px;

        background-image: radial-gradient(
            circle,
            #b9edc2 5px,
            transparent 5.5px
        );

        background-size: 25px 25px;
        opacity: 0.6;
        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );
    }

}

/* ==========================================
   TABLET
========================================== */

@media screen and (min-width: 768px) and (max-width: 1100px) {

    .service-features--01 .service-features__inner {
        width: calc(100% - 70px);
        gap: 55px;
    }

    .service-features--01 .service-features__item {
        gap: 45px;
    }

    .service-features--01 .service-features__title {
        font-size: 20px;
    }

    .service-features--01 .service-features__description {
        font-size: 13px;
    }

    .service-features--01 .service-features__visual img {
        max-width: 330px;
    }

    .service-features--01 .service-features__dots {
        width: 340px;
        height: 360px;
        background-size: 20px 20px;
    }

    .service-features--01 .service-features__ellipse {
        width: 230px;
        height: 330px;
    }

}


/* ==========================================
   SERVICE CONTACT CTA - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* SECTION */

    .service-contact-cta {
        position: relative;
        width: 100%;
        padding: 75px 0 100px;
        background: #ffffff;
        box-sizing: border-box;
    }

    /* INNER */

    .service-contact-cta__inner {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        max-width: 1250px;
        margin: 0 auto;
        padding: 0 40px;
        box-sizing: border-box;
    }

    /* CONTENT */

    .service-contact-cta__content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        max-width: 650px;
        margin: 0 auto;
        padding: 0;

        text-align: center;
        box-sizing: border-box;
    }

    /* TEXT */

    .service-contact-cta__text {
        display: block;
        width: 100%;
        margin: 0 0 65px;
        padding: 0;

        color: #111111;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.8;
        letter-spacing: 0.01em;

        text-align: center;
    }

    /* BUTTON */

    .service-contact-cta__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: 200px;
        min-height: 50px;
        margin: 0 auto;
        padding: 10px 25px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 12px;

        color: #ffffff;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;

        box-sizing: border-box;

        transition:
            background-color 0.3s ease,
            color 0.3s ease,
            transform 0.3s ease;
    }

    .service-contact-cta__button:hover {
        background: #ffffff;
        color: #009900;
        transform: translateY(-2px);
    }

    .service-contact-cta__button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }
}

/* ==========================================
   NEWS SINGLE - PC COMPLETE
========================================== */

@media screen and (min-width: 768px) {

    /* ======================================
       SECTION
    ====================================== */

    .news-single {
        width: 100%;
        padding: 100px 0 120px;
        background: #ffffff;
    }

    .news-single *,
    .news-single *::before,
    .news-single *::after {
        box-sizing: border-box;
    }

    /* ======================================
       ARTICLE
    ====================================== */

    .news-single__article {
        width: calc(100% - 80px);
        max-width: 850px;
        margin: 0 auto;
    }

    /* ======================================
       HEADER
    ====================================== */

    .news-single__header {
        width: 100%;
        margin-bottom: 45px;
        padding-bottom: 25px;
        border-bottom: 1px solid #dddddd;
    }

    /* ======================================
       CATEGORY
    ====================================== */

    .news-single__categories {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 18px;
    }

    .news-single__category {
        display: inline-block;
        padding: 5px 16px;

        background: #eaf8ec;
        border-radius: 4px;

        color: #008f00;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.5;
    }

    /* ======================================
       TITLE
    ====================================== */

    .news-single__title {
        margin: 0 0 18px;

        color: #111111;
        font-size: clamp(24px, 2.5vw, 34px);
        font-weight: 800;
        line-height: 1.6;
        letter-spacing: 0.02em;

        overflow-wrap: anywhere;
    }

    /* ======================================
       DATE
    ====================================== */

    .news-single__date {
        display: block;

        color: #666666;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.5;
    }

    /* ======================================
       THUMBNAIL
    ====================================== */

    .news-single__thumbnail {
        width: 100%;
        margin-bottom: 55px;
        overflow: hidden;
    }

    .news-single__image {
        display: block;
        width: 100%;
        height: auto;
        max-height: 480px;
        object-fit: contain;
    }

    /* ======================================
       ARTICLE CONTENT
    ====================================== */

    .news-single__content {
        width: 100%;

        color: #222222;
        font-size: 15px;
        font-weight: 500;
        line-height: 2;
        letter-spacing: 0.02em;

        overflow-wrap: anywhere;
    }

    .news-single__content p {
        margin: 0 0 25px;
    }

    .news-single__content h2 {
        margin: 55px 0 25px;
        padding: 12px 18px;

        border-left: 5px solid #009900;
        background: #f0f8f0;

        color: #111111;
        font-size: 23px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content h3 {
        margin: 40px 0 20px;
        padding-bottom: 12px;

        border-bottom: 1px solid #009900;

        color: #111111;
        font-size: 19px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content h4 {
        margin: 30px 0 15px;

        color: #111111;
        font-size: 17px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content ul,
    .news-single__content ol {
        margin: 20px 0 30px;
        padding-left: 28px;
    }

    .news-single__content li {
        margin-bottom: 10px;
    }

    .news-single__content img {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 30px auto;
    }

    .news-single__content a {
        color: #008f00;
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    .news-single__content blockquote {
        margin: 30px 0;
        padding: 20px 25px;

        border-left: 4px solid #009900;
        background: #f7faf7;
    }

    .news-single__content blockquote p:last-child {
        margin-bottom: 0;
    }

    /* ======================================
       ARTICLE TABLE
    ====================================== */

    .news-single__content table {
        width: 100%;
        margin: 25px 0;
        border-collapse: collapse;
    }

    .news-single__content th,
    .news-single__content td {
        padding: 12px;
        border: 1px solid #dddddd;
        text-align: left;
    }

    .news-single__content th {
        background: #f0f8f0;
    }

    /* ======================================
       BACK BUTTON
    ====================================== */

    .news-single__back {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-top: 80px;
    }

    .news-single__back-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: 220px;
        min-height: 50px;
        padding: 12px 25px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;

        transition:
            background-color 0.3s ease,
            color 0.3s ease,
            transform 0.3s ease;
    }

    .news-single__back-button:hover {
        background: #ffffff;
        color: #009900;
        transform: translateY(-2px);
    }

    .news-single__back-button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }

}




    /* PCここまで */









/* ==========================================
   HEADER - SP
   max-width: 767px
========================================== */

@media screen and (max-width: 767px) {

    /* ======================================
       HEADER INNER
    ====================================== */

    .site-header__inner {
        width: calc(100% - 32px);
        min-height: 70px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    /* ======================================
       LOGO
    ====================================== */

    .site-header__logo {
        width: 125px;
        flex-shrink: 0;
    }

    .site-header__logo a {
        display: block;
        width: 100%;
    }

    .site-header__logo img {
        display: block;
        width: 100%;
        height: auto;
    }

    /* ======================================
       PC NAV HIDE
    ====================================== */

    .site-header__nav {
        display: none;
    }

    /* ======================================
       HAMBURGER BUTTON
    ====================================== */

    .site-header__hamburger {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        width: 44px;
        height: 44px;
        padding: 0;
        margin: 0;
        flex-shrink: 0;
        position: relative;
        z-index: 1002;
        background: #079b39;
        border: none;
        border-radius: 12px;
        cursor: pointer;
    }

    .site-header__hamburger span {
        display: block;
        width: 21px;
        height: 2px;
        background: #ffffff;
        border-radius: 2px;
        transition:
            transform 0.3s ease,
            opacity 0.3s ease;
    }

    /* 開いた時の× */

    .site-header__hamburger.is-active span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .site-header__hamburger.is-active span:nth-child(2) {
        opacity: 0;
    }

    .site-header__hamburger.is-active span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* ======================================
       MOBILE NAVIGATION
    ====================================== */

    .site-header__mobile-nav {
        display: flex;
        flex-direction: column;
        gap: 24px;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        padding: 24px 20px 32px;
        background: #ffffff;
        box-shadow: 0 12px 22px rgba(0, 0, 0, 0.08);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        pointer-events: none;
        transition:
            opacity 0.3s ease,
            visibility 0.3s ease,
            transform 0.3s ease;
        z-index: 1001;
    }

    .site-header__mobile-nav.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* ======================================
       MOBILE MENU
    ====================================== */

    .site-header__mobile-menu {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .site-header__mobile-menu li {
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #eeeeee;
    }

    .site-header__mobile-menu a {
        display: block;
        padding: 16px 4px;
        color: #222222;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.6;
        text-decoration: none;
    }

    /* ======================================
       MOBILE CONTACT BUTTON
    ====================================== */

    .site-header__mobile-contact {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 52px;
        padding: 12px 42px;
        background: #079b39;
        border-radius: 15px;
        color: #ffffff;
        font-size: 15px;
        font-weight: 700;
        text-decoration: none;
    }

    .site-header__mobile-contact .site-header__arrow {
        right: 20px;
        width: 20px;
    }

    .site-header__mobile-contact .site-header__arrow::after {
        width: 8px;
        height: 8px;
    }
	    /* ======================================
       FOOTER
    ====================================== */

    .site-footer {
        padding: 45px 0 50px;
    }

    /* ======================================
       INNER
    ====================================== */

    .site-footer__inner {
        width: calc(100% - 40px);
        max-width: 420px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 35px;
    }

    /* ======================================
       LOGO
    ====================================== */

    .site-footer__logo {
        width: 120px;
        flex-shrink: 0;
    }

    .site-footer__logo a {
        display: block;
        width: 100%;
    }

    .site-footer__logo img {
        display: block;
        width: 100%;
        height: auto;
    }

    /* ======================================
       NAVIGATION
    ====================================== */

    .site-footer__nav {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    /* ======================================
       MENU
    ====================================== */

    .site-footer__menu {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 0;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .site-footer__menu li {
        width: 100%;
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #222222;
    }

    .site-footer__menu a {
        display: block;
        width: 100%;
        padding: 13px 2px;
        color: #222222;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
        text-decoration: none;
    }

    /* ======================================
       CONTACT BUTTON
    ====================================== */

    .site-footer__contact {
        width: 180px;
        min-height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 30px;
        padding: 8px 15px;
        background: #009b00;
        border-radius: 11px;
        color: #ffffff;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.4;
        text-decoration: none;
    }
	    /* ======================================
       FV
    ====================================== */

    .fv {
        width: 100%;
        min-height: 680px;
        min-height: 100svh;
        margin-top: -70px;
        padding-top: 70px;
        overflow: hidden;
        background: #e9faff;
    }

    /* ======================================
       BACKGROUND
    ====================================== */

    .fv__background {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: 56% center;
        background-repeat: no-repeat;
    }

    /* ======================================
       INNER
    ====================================== */

    .fv__inner {
        position: relative;
        z-index: 1;
        width: calc(100% - 36px);
        max-width: 500px;
        margin: 0 auto;
        padding-top: 30px;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .fv__content {
        width: 100%;
        max-width: 100%;
    }

    /* ======================================
       TITLE
    ====================================== */

    .fv__title {
        margin: 0;
        font-size: clamp(19px, 5.1vw, 28px);
        font-weight: 800;
        line-height: 1.5;
        letter-spacing: -0.035em;
    }

    .fv__title-line {
        display: block;
        width: fit-content;
        max-width: 100%;
    }

    .fv__title-line--green {
        color: #006c27;
    }

    .fv__highlight {
        background: linear-gradient(
            transparent 80%,
            #f3f22b 80%,
            #f3f22b 96%,
            transparent 96%
        );
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .fv__description {
        margin-top: 18px;
        font-size: clamp(11px, 3vw, 13px);
        font-weight: 600;
        line-height: 1.8;
        letter-spacing: 0;
    }

    .fv__pc-only {
        display: none;
    }
    .fv__inner {
        width: calc(100% - 28px);
    }

    .fv__title {
        font-size: 18px;
    }

    .fv__description {
        font-size: 11px;
    }
	    /* ======================================
       FV
    ====================================== */

    .fv {
        position: relative;
        width: 100%;
        min-height: 680px;
        min-height: 100svh;
        margin-top: -70px;
        padding-top: 70px;
        overflow: hidden;
        background: #e9faff;
        box-sizing: border-box;
    }

    /* ======================================
       BACKGROUND
    ====================================== */

    .fv__background {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: 56% center;
        background-repeat: no-repeat;
        z-index: 0;
    }

    /* ======================================
       INNER
    ====================================== */

    .fv__inner {
        position: relative;
        z-index: 2;
        width: calc(100% - 36px);
        max-width: 500px;
        margin: 0 auto;
        padding-top: 30px;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .fv__content {
        width: 100%;
        max-width: 100%;
    }

    /* ======================================
       TITLE
    ====================================== */

    .fv__title {
        margin: 0;
        padding: 0;
        color: #292929;
        font-size: clamp(18px, 4.8vw, 26px);
        font-weight: 800;
        line-height: 1.5;
        letter-spacing: -0.04em;
    }

    .fv__title-line {
        display: block;
        width: fit-content;
        max-width: 100%;
    }

    .fv__title-line--green {
        color: #006c27;
    }

    /* 黄色マーカー */

    .fv__highlight {
        position: relative;
        display: inline;
        background: linear-gradient(
            transparent 80%,
            #f3f22b 80%,
            #f3f22b 96%,
            transparent 96%
        );
        box-decoration-break: clone;
        -webkit-box-decoration-break: clone;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .fv__description {
        margin: 16px 0 0;
        padding: 0;
        color: #292929;
        font-size: clamp(11px, 2.8vw, 13px);
        font-weight: 600;
        line-height: 1.8;
        letter-spacing: 0;
    }

    .fv__pc-only {
        display: none;
    }

    /* ======================================
       BICYCLE ANIMATION AREA
    ====================================== */

    .fv__bicycles {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        z-index: 1;
        pointer-events: none;
    }

    /* ======================================
       BICYCLE COMMON
    ====================================== */

    .fv__bicycle {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        width: 40px;
        height: auto;
        max-width: none;
        object-fit: contain;
        opacity: 0;
        transform-origin: center bottom;
        will-change: transform, opacity;
        animation: fvBicycleRideSP 12s linear infinite;
    }

    /* ======================================
       BICYCLE 01
    ====================================== */

    .fv__bicycle--01 {
        width: 44px;
        animation-delay: 0s;
    }

    /* ======================================
       BICYCLE 02
    ====================================== */

    .fv__bicycle--02 {
        width: 40px;
        animation-delay: -3s;
    }

    /* ======================================
       BICYCLE 03
    ====================================== */

    .fv__bicycle--03 {
        width: 42px;
        animation-delay: -6s;
    }

    /* ======================================
       BICYCLE 04
    ====================================== */

    .fv__bicycle--04 {
        width: 38px;
        animation-delay: -9s;
    }

    /* ======================================
       BICYCLE ANIMATION - SP

       フェードイン
       ↓
       道路に沿って移動
       ↓
       徐々に縮小
       ↓
       手前でフェードアウト
       ↓
       無限ループ
    ====================================== */



/* ======================================
   BICYCLE ANIMATION - SP
   背景画像の道路座標に連動
====================================== */

@keyframes fvBicycleRideSP {

    0% {
        transform:
            translate(
                calc(var(--bike-x0, -100px) - 50%),
                calc(var(--bike-y0, -100px) - 100%)
            )
            scale(1);
        opacity: 0;
    }

    10% {
        transform:
            translate(
                calc(var(--bike-x1, -100px) - 50%),
                calc(var(--bike-y1, -100px) - 100%)
            )
            scale(0.85);
        opacity: 1;
    }

    20% {
        transform:
            translate(
                calc(var(--bike-x2, -100px) - 50%),
                calc(var(--bike-y2, -100px) - 100%)
            )
            scale(0.65);
        opacity: 1;
    }

30% {
    transform:
        translate(
            calc(var(--bike-x3, -100px) - 50% + 15px),
            calc(var(--bike-y3, -100px) - 100%)
        )
        scale(0.5);
    opacity: 0;
}
/* 透明のまま終了 */
100% {
    transform:
        translate(
            calc(var(--bike-x3, -100px) - 50% + 15px),
            calc(var(--bike-y3, -100px) - 100%)
        )
        scale(0.5);
    opacity: 0;
}
}

	
    /* ======================================
       SECTION
    ====================================== */

    .about-section {
        padding: 65px 0 70px;
    }

    /* ======================================
       INNER
    ====================================== */

    .about-section__inner {
        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .about-section__content {
        width: 100%;
        flex-shrink: 1;
    }

    /* ======================================
       HEADING
    ====================================== */

    .about-section__heading {
        gap: 12px;
        margin-bottom: 28px;
    }

    .about-section__heading::before {
        width: 75px;
        height: 75px;
        left: -18px;
    }

    .about-section__title {
        font-size: 46px;
        letter-spacing: -0.045em;
    }

    .about-section__subtitle {
        font-size: 11px;
    }

    /* ======================================
       CATCH
    ====================================== */

    .about-section__catch {
        margin-bottom: 24px;
        font-size: clamp(17px, 4.5vw, 21px);
        line-height: 1.65;
    }

    /* ======================================
       TEXT
    ====================================== */

    .about-section__text p {
        margin-bottom: 18px;
        font-size: 13px;
        line-height: 1.85;
    }

    /* ======================================
       BUTTON
    ====================================== */

    .about-section__button {
        width: 165px;
        min-height: 42px;
        margin-top: 30px;
        font-size: 13px;
        border-radius: 10px;
    }

    /* ======================================
       IMAGE
    ====================================== */

    .about-section__image {
        width: 100%;
        max-width: 440px;
    }

    .about-section__image img {
        width: 100%;
        height: auto;
    }

    /* ======================================
       DOT DECORATION
    ====================================== */

    .about-section__dots {
        width: 180px;
        height: 160px;
        background-size: 18px 18px;
        background-image: radial-gradient(
            circle,
            #b8ecc2 2.5px,
            transparent 3px
        );
        opacity: 0.45;
    }
	    .louis-marquee {
        width: 100%;
        padding: 12px 0;
        overflow: hidden;
    }

    .louis-marquee__track {
        animation-duration: 25s;
    }

    .louis-marquee__group {
        gap: 22px;
        padding-right: 22px;
    }

    .louis-marquee__group span {
        font-size: clamp(65px, 15vw, 100px);
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: -0.045em;
        white-space: nowrap;
    }
	    .what-section {
        min-height: auto;
        padding: 55px 0 65px;
    }

    /* ======================================
       MAIN CONTENT
    ====================================== */

    .what-section__inner {
        width: calc(100% - 36px);
        max-width: 500px;
        margin: 0 auto;
        text-align: center;
    }

    /* ======================================
       HEADING
    ====================================== */

    .what-section__heading {
        margin-bottom: 22px;
    }

    .what-section__heading::before {
        width: 65px;
        height: 65px;
        top: -12px;
        left: 0;
    }

    .what-section__title {
        font-size: clamp(30px, 8vw, 43px);
        letter-spacing: -0.05em;
        white-space: nowrap;
    }

    /* ======================================
       CATCH COPY
    ====================================== */

    .what-section__catch {
        margin-bottom: 22px;
        font-size: 16px;
        line-height: 1.65;
    }

    /* ======================================
       TEXT
    ====================================== */

    .what-section__text {
        max-width: 100%;
    }

    .what-section__text p {
        margin-bottom: 18px;
        font-size: 12px;
        line-height: 1.9;
    }

    /* ======================================
       IMAGES
    ====================================== */

    .what-section__image {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        max-width: none;
    }

    /* 上段画像 */

    .what-section__image--tl,
    .what-section__image--tr {
        display: inline-block;
        width: 42%;
        margin: 0 3% 25px;
        vertical-align: middle;
    }

    /* 下段画像 */

    .what-section__image--bl,
    .what-section__image--br {
        display: inline-block;
        width: 42%;
        margin: 30px 3% 0;
        vertical-align: middle;
    }

    /* ======================================
       DOTS
    ====================================== */

    .what-section__dots {
        width: 180px;
        height: 160px;
        left: -20px;
        bottom: 0;
        background-size: 17px 17px;
        background-image: radial-gradient(
            circle,
            #b8ecc2 2.5px,
            transparent 3px
        );
        opacity: 0.45;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .service-cards {
        padding: 45px 0 65px;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-cards__inner {
        width: calc(100% - 40px);
        max-width: 440px;
        margin: 0 auto;

        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    /* ======================================
       CARD
    ====================================== */

    .service-card {
        width: 100%;
        aspect-ratio: 1.15;
    }

    /* ======================================
       IMAGE
    ====================================== */

    .service-card__image img {
        object-fit: cover;
    }

    /* ======================================
       WHITE FILTER
    ====================================== */

    .service-card__overlay {
        background: rgba(255, 255, 255, 0.58);
        transform: scale(1);
    }

    /* タップ・フォーカス時 */

    .service-card:active .service-card__overlay,
    .service-card:focus-visible .service-card__overlay {
        transform: scale(0.15);
        opacity: 0;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .service-card__content {
        padding: 16px;
    }

    /* ======================================
       TITLE
    ====================================== */

    .service-card__title {
        font-size: 21px;
        margin-bottom: 22px;
        line-height: 1.4;
    }

    /* ======================================
       BUTTON
    ====================================== */

    .service-card__button {
        width: 55px;
        height: 55px;
    }

    .service-card__arrow {
        width: 21px;
    }

    /* ======================================
       DOTS
    ====================================== */

    .service-cards__dots {
        width: 200px;
        height: 180px;
        background-size: 18px 18px;
        background-image: radial-gradient(
            circle,
            #bdeec8 2.5px,
            transparent 3px
        );
        opacity: 0.5;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .strength-section {
        padding: 85px 0 65px;
    }

    /* ======================================
       OUTER
    ====================================== */

    .strength-section__outer {
        width: calc(100% - 30px);
        max-width: 500px;
    }

    /* ======================================
       PEOPLE
    ====================================== */

    .strength-section__people {
        top: -65px;
        right: 15px;
        width: 130px;
    }

    /* ======================================
       GREEN PANEL
    ====================================== */

    .strength-section__panel {
        padding: 60px 25px 55px;
        border-radius: 38px;
    }

    /* ======================================
       HEADING
    ====================================== */

    .strength-section__heading {
        margin-bottom: 35px;
        font-size: 24px;
        line-height: 1.5;
    }

    /* ======================================
       LIST
    ====================================== */

    .strength-section__list {
        display: flex;
        flex-direction: column;
        gap: 45px;
    }

    /* ======================================
       ITEM
    ====================================== */

    .strength-section__item {
        width: 100%;
        text-align: center;
    }

    /* ======================================
       IMAGE
    ====================================== */

    .strength-section__image {
        height: 175px;
        margin-bottom: 20px;
    }

    .strength-section__image img {
        max-width: 210px;
    }

    .strength-section__image::before {
        width: 110px;
        height: 110px;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .strength-section__content {
        max-width: 280px;
        text-align: center;
    }

    /* ======================================
       TITLE
    ====================================== */

    .strength-section__title {
        margin-bottom: 12px;
        font-size: 21px;
    }

    /* ======================================
       TEXT
    ====================================== */

    .strength-section__text {
        font-size: 12px;
        line-height: 1.8;
    }

    /* ======================================
       DOTS
    ====================================== */

    .strength-section__dots--top {
        width: 120px;
        height: 150px;
    }

    .strength-section__dots--left {
        width: 140px;
        height: 160px;
        bottom: 35%;
    }

    .strength-section__dots--bottom {
        width: 150px;
        height: 90px;
        left: 45%;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .workflow-section {
        padding: 60px 0 70px;
    }

    /* ======================================
       INNER
    ====================================== */

    .workflow-section__inner {
        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;

        display: flex;
        flex-direction: column;
        gap: 35px;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .workflow-section__content {
        display: contents;
    }

    /* ======================================
       HEADING
    ====================================== */

    .workflow-section__heading {
        order: 1;
        width: 100%;
        gap: 10px;
        margin-bottom: 0;
    }

    .workflow-section__heading::before {
        top: -13px;
        left: -12px;
        width: 65px;
        height: 65px;
    }

    .workflow-section__title {
        font-size: clamp(29px, 8vw, 42px);
        letter-spacing: -0.05em;
    }

    .workflow-section__subtitle {
        font-size: 10px;
    }

    /* ======================================
       IMAGE
    ====================================== */

    .workflow-section__image {
        order: 2;
        width: 100%;
        padding-left: 0;
    }

    .workflow-section__image img {
        width: 100%;
        max-width: 380px;
        margin: 0 auto;
    }

    /* ======================================
       FLOW LIST
    ====================================== */

    .workflow-section__list {
        order: 3;
        width: 100%;
        padding-left: 0;
        gap: 30px;
    }

    /* ======================================
       FLOW ITEM
    ====================================== */

    .workflow-section__item {
        width: 100%;
    }

    .workflow-section__item-title {
        margin-bottom: 10px;
        font-size: 19px;
        line-height: 1.5;
    }

    .workflow-section__item-text {
        padding-left: 30px;
        font-size: 12px;
        line-height: 1.8;
    }

    /* ======================================
       DOT DECORATION
    ====================================== */

    .workflow-section__dots {
        left: -15px;
        bottom: 20px;

        width: 210px;
        height: 150px;

        background-size: 17px 17px;

        background-image: radial-gradient(
            circle,
            #b8ecc2 2.5px,
            transparent 3px
        );

        -webkit-mask-image: radial-gradient(
            ellipse 70% 65% at center,
            #000 35%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 70% 65% at center,
            #000 35%,
            transparent 100%
        );

        opacity: 0.45;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .promises-section {
        position: relative;
        width: 100%;
        padding: 65px 0 75px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    /* ======================================
       INNER
    ====================================== */

    .promises-section__inner {
        position: relative;
        z-index: 1;
        width: calc(100% - 44px);
        max-width: 450px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .promises-section__heading {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin-bottom: 30px;
    }

    /* 地球イラスト */

    .promises-section__heading-icon {
        position: relative;
        z-index: 2;
        width: 50px;
        flex-shrink: 0;

        /* 最終調整した位置 */
        transform: translateY(-15px);
    }

    .promises-section__heading-icon::before {
        content: none;
    }

    .promises-section__heading-icon img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    /* 見出しテキスト */

    .promises-section__heading-text {
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    /* 3つの約束 */

    .promises-section__subtitle {
        margin: 0 0 2px;
        color: #111111;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* PROMISES */

    .promises-section__title {
        position: relative;
        isolation: isolate;
        margin: 0;
        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(30px, 8.5vw, 36px);
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: -0.045em;
        white-space: nowrap;
    }

    .promises-section__title span {
        color: #009b00;
    }

    /* ======================================
       薄緑の円
       地球とPの間
    ====================================== */

    .promises-section__title::before {
        content: "";
        position: absolute;
        z-index: -1;

        width: 48px;
        height: 48px;

        /* 最終調整した位置 */
        left: -25px;
        top: -9px;

        border-radius: 50%;
        background: #eaf8ec;
        pointer-events: none;
    }

    /* ======================================
       LEAD TEXT
    ====================================== */

    .promises-section__lead {
        width: 100%;
        max-width: 350px;
        margin: 0 auto 55px;

        color: #111111;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.9;
        letter-spacing: 0.01em;
        text-align: center;
    }

    .promises-section__lead br {
        display: none;
    }

    /* ======================================
       PROMISE LIST
    ====================================== */

    .promises-section__list {
        display: flex;
        flex-direction: column;
        gap: 55px;
        width: 100%;
    }

    /* ======================================
       PROMISE ITEM
    ====================================== */

    .promises-section__item {
        position: relative;
        width: 100%;
        min-width: 0;
    }

    /* ======================================
       GREEN BORDER BOX
    ====================================== */

    .promises-section__box {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-height: 170px;
        padding: 25px 12px 20px;

        border: 8px solid #439e43;
        background: #ffffff;
    }

    /* ======================================
       NUMBER
    ====================================== */

    .promises-section__number {
        position: absolute;
        z-index: 2;

        top: -28px;
        left: -15px;

        color: #439e43;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 48px;
        font-weight: 800;
        line-height: 1;
        letter-spacing: -0.05em;
    }

    /* ======================================
       ICON
    ====================================== */

    .promises-section__icon {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 58px;
        height: 58px;
        margin-bottom: 6px;
    }

    .promises-section__icon img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    /* ======================================
       ENGLISH LABEL
    ====================================== */

    .promises-section__en {
        margin: 0 0 5px;
        color: #008d00;
        font-family: Georgia, "Times New Roman", serif;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.3;
        text-align: center;
    }

    /* ======================================
       JAPANESE TITLE
    ====================================== */

    .promises-section__item-title {
        margin: 0;
        color: #000000;
        font-size: clamp(18px, 5.5vw, 22px);
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
        white-space: nowrap;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .promises-section__description {
        width: 100%;
        margin-top: 18px;
        padding-top: 15px;
        border-top: 2px solid #111111;
    }

    .promises-section__description p {
        margin: 0;
        color: #111111;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.8;
        letter-spacing: 0.01em;
        overflow-wrap: anywhere;
    }

    .promises-section__description br {
        display: none;
    }

    /* ======================================
       DOT DECORATION
       RIGHT BOTTOM
    ====================================== */

    .promises-section__dots {
        position: absolute;
        z-index: 0;

        right: -15px;
        bottom: 10px;

        width: 150px;
        height: 130px;

        background-image: radial-gradient(
            circle,
            #b8ecc2 2.5px,
            transparent 3px
        );

        background-size: 17px 17px;
        opacity: 0.45;
        pointer-events: none;

        /* 楕円形に自然にフェードアウト */

        -webkit-mask-image: radial-gradient(
            ellipse 75% 65% at center,
            #000 35%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 75% 65% at center,
            #000 35%,
            transparent 100%
        );
    }
	    /* ======================================
       SECTION
    ====================================== */

    .faq-section {
        position: relative;
        width: 100%;
        min-height: auto;
        padding: 110px 0 160px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    /* ======================================
       INNER
    ====================================== */

    .faq-section__inner {
        position: relative;
        z-index: 2;
        width: calc(100% - 36px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .faq-section__heading {
        margin-bottom: 45px;
    }

    .faq-section__subtitle {
        margin-bottom: 5px;
        font-size: 12px;
    }

    .faq-section__title {
        font-size: 42px;
    }

    /* 薄緑の円 */

    .faq-section__title::before {
        width: 45px;
        height: 45px;
        top: -14px;
        left: -28px;
    }

    /* ======================================
       FAQ LIST
    ====================================== */

    .faq-section__list {
        width: 100%;
    }

    .faq-section__item {
        width: 100%;
    }

    /* ======================================
       QUESTION
    ====================================== */

    .faq-section__question {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 58px;
        padding: 13px 16px;
        background: #edf5ed;
        border-bottom: 1px solid #a1cfa3;
        cursor: pointer;
        list-style: none;
    }

    .faq-section__question::-webkit-details-marker {
        display: none;
    }

    .faq-section__question::marker {
        content: "";
    }

    .faq-section__question-text {
        display: block;
        width: 100%;
        color: #008b00;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.6;
        overflow-wrap: anywhere;
    }

    /* ======================================
       ANSWER
    ====================================== */

    .faq-section__answer {
        width: 100%;
        padding: 22px 15px 28px;
        background: #ffffff;
    }

    .faq-section__answer p {
        margin: 0;
        color: #111111;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.8;
        overflow-wrap: anywhere;
    }

    .faq-section__answer br {
        display: none;
    }

    /* ======================================
       HELMET ILLUSTRATION
    ====================================== */

    .faq-section__helmet {
        top: 18px;
        left: 18px;
        width: 100px;
    }

    .faq-section__helmet img {
        width: 100%;
        height: auto;
    }

    /* ======================================
       HOUSE ILLUSTRATION
    ====================================== */

    .faq-section__house {
        right: 18px;
        bottom: 35px;
        width: 135px;
    }

    .faq-section__house img {
        width: 100%;
        height: auto;
    }

    /* ======================================
       DOT DECORATION
    ====================================== */

    .faq-section__dots {
        background-image: radial-gradient(
            circle,
            #b9edc2 3px,
            transparent 3.5px
        );

        background-size: 18px 18px;
        opacity: 0.5;
    }

    /* 右上 */

    .faq-section__dots--top {
        top: -10px;
        right: -25px;
        width: 155px;
        height: 180px;
    }

    /* 左下 */

    .faq-section__dots--bottom {
        left: -30px;
        bottom: 0;
        width: 220px;
        height: 140px;

        -webkit-mask-image: radial-gradient(
            ellipse 75% 70% at center,
            #000 35%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 75% 70% at center,
            #000 35%,
            transparent 100%
        );
    }
    /* ======================================
       SECTION
    ====================================== */

    .contact-section {
        position: relative;
        width: 100%;
        padding: 0;
        margin: 0;
        background-color: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    /* ======================================
       INNER
       画面横幅いっぱい
    ====================================== */

    .contact-section__inner {
        position: relative;
        z-index: 1;

        width: 100%;
        max-width: none;

        margin: 0;
        padding: 0;
    }

    /* ======================================
       BACKGROUND VISUAL
    ====================================== */

    .contact-section__visual {
        position: relative;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-height: 600px;

        margin: 0;
        padding: 85px 18px 100px;

        /* 背景画像 */
        background-image: url("../images/contact-city.png");
        background-color: transparent;
        background-repeat: no-repeat;
        background-position: center center;

        /*
         * PCと同じ画像を使用。
         * SPでは画像の高さに合わせて拡大。
         */
        background-size: auto 100%;
    }

    /* ======================================
       WHITE PANEL
       白い座布団
    ====================================== */

    .contact-section__panel {
        position: relative;
        z-index: 2;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        max-width: 440px;
        min-height: 340px;

        margin: 0 auto;
        padding: 40px 20px;

        background: #ffffff;

        box-shadow: 0 0 16px rgba(0, 0, 0, 0.13);

        text-align: center;
        flex-shrink: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .contact-section__heading {
        width: 100%;
        margin: 0 0 28px;
        text-align: center;
    }

    /* お問い合わせ */

    .contact-section__subtitle {
        margin: 0 0 8px;

        color: #000000;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.4;
    }

    /* CONTACT US */

    .contact-section__title {
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(26px, 7.5vw, 36px);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.045em;

        white-space: nowrap;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .contact-section__description {
        width: 100%;
        max-width: 100%;

        margin: 0 auto 30px;

        color: #000000;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.9;
        letter-spacing: 0;

        text-align: center;
        overflow-wrap: anywhere;
    }

    /* PC用改行を非表示 */

    .contact-section .pc-only {
        display: none;
    }

    /* ======================================
       CONTACT BUTTON
    ====================================== */

    .contact-section__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: auto;
        min-width: 170px;
        min-height: 40px;

        margin: 0 auto;
        padding: 9px 20px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 14px;
        font-weight: 800;
        line-height: 1.4;

        text-align: center;
        text-decoration: none;

        transition:
            background-color 0.3s ease,
            color 0.3s ease,
            transform 0.3s ease;
    }

    .contact-section__button:hover {
        background: #ffffff;
        color: #009900;
        transform: translateY(-2px);
    }

    .contact-section__button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }

    /* ======================================
       DOT DECORATION
       LEFT TOP
    ====================================== */

    .contact-section__dots {
        position: absolute;
        z-index: 3;

        top: 0;
        left: -10px;

        width: 90px;
        height: 180px;

        background-image: radial-gradient(
            circle,
            #b9edc2 3px,
            transparent 3.5px
        );

        background-size: 18px 18px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at top left,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at top left,
            #000 45%,
            transparent 100%
        );
    }
    /* ======================================
       PAGE
    ====================================== */

    .contact-page {
        min-height: auto;
        padding: 95px 0 90px;
        overflow: hidden;
    }

    .contact-page__inner {
        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .contact-page__heading {
        align-items: center;
        margin-bottom: 55px;
    }

    .contact-page__heading-center {
        width: 100%;
        max-width: 300px;
    }

    .contact-page__heading-en {
        margin-bottom: 5px;
        font-size: 17px;
    }

    .contact-page__heading-title {
        font-size: 25px;
    }

    .contact-page__lead {
        margin-top: 15px;
        font-size: 10px;
        line-height: 1.9;
        overflow-wrap: anywhere;
    }

    .contact-page__pc-br {
        display: none;
    }

    /* 左側の観葉植物 */

    .contact-page__plant {
        width: 42px;
        right: auto;
        left: -8px;
        top: -45px;
    }

    /* 右側の作業員 */

    .contact-page__worker {
        width: 55px;
        left: auto;
        right: -8px;
        top: -40px;
    }

    /* ======================================
       FORM AREA
    ====================================== */

    .contact-page__form-area {
        width: 100%;
        max-width: none;
    }

    .contact-form {
        width: 100%;
    }

    /* ======================================
       FORM ROW
    ====================================== */

    .contact-form__row {
        display: flex;
        flex-direction: column;
        gap: 9px;
        margin-bottom: 25px;
    }

    .contact-form__label {
        padding: 0;
        font-size: 14px;
        line-height: 1.5;
    }

    .contact-form__field {
        width: 100%;
    }

    /* ======================================
       INPUT
    ====================================== */

    .contact-form__input {
        width: 100%;
        height: 43px;
        padding: 8px 10px;
        font-size: 16px;
        border: 1px solid #222;
        border-radius: 0;
    }

    /* ======================================
       CHECKBOXES
    ====================================== */

    .contact-form__row--type {
        margin-top: 10px;
        margin-bottom: 45px;
    }

    .contact-form__row--type .wpcf7-checkbox {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 15px 8px;
    }

    .contact-form__row--type .wpcf7-list-item label {
        gap: 5px;
    }

    .contact-form__checkboxes .wpcf7-list-item-label {
        font-size: 12px;
    }

    .contact-form__row--type input[type="checkbox"],
    .contact-form__agreement input[type="checkbox"] {
        width: 21px;
        height: 21px;
    }

    /* ======================================
       MESSAGE
    ====================================== */

    .contact-form__row--message {
        margin-bottom: 35px;
    }

    .contact-form__row--message .contact-form__label {
        margin-bottom: 0;
    }

    .contact-form__row--message .contact-form__field {
        width: 100%;
        max-width: none;
    }

    .contact-form__textarea {
        width: 100%;
        height: 180px;
        min-height: 180px;
        padding: 12px;
        font-size: 16px;
    }

    /* ======================================
       PRIVACY POLICY
    ====================================== */

    .contact-form__privacy {
        width: 100%;
        max-width: none;
    }

    .contact-form__privacy-title {
        margin-bottom: 10px;
        font-size: 16px;
    }

    /* 枠内だけ縦スクロール */

    .contact-form__privacy-scroll {
        width: 100%;
        height: 180px;
        padding: 15px 12px;

        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;

        border: 1px solid #222;
        background: #fff;
    }

    .contact-form__privacy-scroll h4 {
        font-size: 12px;
    }

    .contact-form__privacy-scroll p {
        font-size: 11px;
        line-height: 1.7;
    }

    /* ======================================
       AGREEMENT
    ====================================== */

    .contact-form__agreement {
        margin-top: 20px;
        font-size: 12px;
    }

    .contact-form__agreement .wpcf7-list-item label {
        gap: 8px;
    }

    /* ======================================
       SUBMIT BUTTON
    ====================================== */

    .contact-form__submit {
        margin-top: 40px;
        text-align: center;
    }

    .contact-form__submit-button {
        width: 150px;
        min-height: 43px;
        padding: 10px 20px;
        font-size: 14px;
        border-radius: 5px;
    }

    /* ======================================
       PHOTO
    ====================================== */

    .contact-page__photo {
        position: relative;
        right: auto;
        bottom: auto;

        width: 190px;
        margin: 60px auto 0;
        border-radius: 20px;
    }

    /* ======================================
       DECORATION
    ====================================== */

    .contact-page__decoration--top {
        top: 75px;
        right: -85px;
        width: 200px;
        height: 240px;

        background-size: 15px 15px;
    }

    .contact-page__decoration--bottom {
        left: -85px;
        bottom: 130px;
        width: 200px;
        height: 220px;

        background-size: 13px 13px;
    }

    .contact-page__decoration--top::after,
    .contact-page__decoration--bottom::after {
        width: 110px;
        height: 110px;
    }

    .information-page {
        min-height: auto;
        padding: 75px 0 90px;
    }

    .information-page__inner {
        width: calc(100% - 36px);
        max-width: 500px;
    }

    /* ======================================
       HEADING
    ====================================== */

    .information-page__heading {
        padding-bottom: 18px;
        margin-bottom: 35px;
    }

    .information-page__heading-content {
        flex-wrap: wrap;
        gap: 8px 12px;
    }

    .information-page__title {
        font-size: clamp(30px, 8vw, 40px);
    }

    .information-page__title::before {
        width: 42px;
        height: 42px;
        top: -9px;
        left: -18px;
    }

    .information-page__subtitle {
        margin-top: 5px;
        font-size: 12px;
    }

    .information-page__heading-image {
        width: 50px;
        margin-top: 0;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .information-page__content {
        display: block;
    }

    /* ======================================
       CATEGORIES
    ====================================== */

    .information-page__categories {
        display: flex;
        flex-direction: row;
        gap: 20px;
        margin-bottom: 30px;
    }

    .information-page__category {
        width: auto;
        padding: 8px 2px;
        font-size: 15px;
    }

    /* ======================================
       POST LIST
    ====================================== */

    .information-page__item-link {
        flex-wrap: wrap;
        gap: 5px 8px;
        min-height: 65px;
        padding: 12px 0;
    }

    .information-page__date {
        font-size: 12px;
    }

    .information-page__post-category {
        font-size: 11px;
    }

    .information-page__post-title {
        flex-basis: 100%;
        font-size: 13px;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    /* ======================================
       PAGINATION
    ====================================== */

    .information-page__pagination {
        gap: 6px;
        margin-top: 35px;
    }

    .information-page__pagination .page-numbers {
        min-width: 32px;
        height: 32px;
        font-size: 12px;
    }

    /* ======================================
       DECORATION
    ====================================== */

    .information-page__dots {
        top: 75px;
        right: -90px;
        width: 200px;
        height: 230px;

        background-size: 14px 14px;
    }

    .information-page__dots::after {
        width: 110px;
        height: 110px;
    }
	
    /* ======================================
       SECTION
    ====================================== */

    .about-page-fv {
        padding: 65px 0 80px;
        overflow: hidden;
    }

    /* ======================================
       INNER
    ====================================== */

    .about-page-fv__inner {
        width: calc(100% - 30px);
        max-width: 500px;
        min-height: 570px;
        margin: 0 auto;
    }

    /* ======================================
       CENTER CONTENT
    ====================================== */

    .about-page-fv__content {
        position: relative;
        z-index: 2;

        width: 100%;
        max-width: 100%;

        margin: 0 auto;
        padding-top: 105px;

        text-align: center;
    }

    /* ======================================
       TITLE
    ====================================== */

    .about-page-fv__title {
        font-size: clamp(24px, 6.4vw, 34px);
        line-height: 1.4;
        letter-spacing: -0.05em;
        white-space: nowrap;
    }

    .about-page-fv__title-ja {
        font-size: 0.65em;
        letter-spacing: -0.06em;
    }

    /* Lの背面の円 */

    .about-page-fv__title-l::before {
        width: 30px;
        height: 30px;
        top: -12px;
        left: -20px;
    }

    /* ======================================
       DESCRIPTIONS
    ====================================== */

    .about-page-fv__descriptions {
        width: 100%;
        max-width: 100%;
        margin-top: 35px;
    }

    .about-page-fv__description {
        font-size: 12px;
        font-weight: 700;
        line-height: 2;
        letter-spacing: 0;
        overflow-wrap: anywhere;
    }

    .about-page-fv__description + .about-page-fv__description {
        margin-top: 30px;
    }

    .about-page-fv__pc-br {
        display: none;
    }

    /* ======================================
       ILLUSTRATIONS
    ====================================== */

    .about-page-fv__illustration {
        position: absolute;
        z-index: 1;
    }

    /* 左上：作業員 */

    .about-page-fv__illustration--worker {
        top: 0;
        left: 0;
        width: 100px;
    }

    /* 右上：ビル */

    .about-page-fv__illustration--building {
        top: 0;
        right: 0;
        width: 110px;
    }

    /* 左下：設計図 */

    .about-page-fv__illustration--blueprint {
        bottom: 0;
        left: 0;
        width: 115px;
    }

    /* 右下：打ち合わせ */

    .about-page-fv__illustration--meeting {
        bottom: 0;
        right: 0;
        width: 135px;
    }
	    /* ======================================
       SECTION
       横スクロール防止
    ====================================== */

    .company-promises {
        position: relative;
        width: 100%;
        max-width: 100%;
        padding: 55px 0 90px;
        overflow-x: clip;
    }

    /* ======================================
       WRAPPER
    ====================================== */

    .company-promises__wrap {
        position: relative;
        width: calc(100% - 30px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       GREEN PANEL
    ====================================== */

    .company-promises__panel {
        position: relative;
        width: 100%;
        padding: 65px 15px 45px;
        border-radius: 28px;
        overflow: hidden;
        background: #2d9c3c;
    }

    .company-promises__inner {
        position: relative;
        z-index: 3;
        width: 100%;
        max-width: none;
        margin: 0 auto;
    }

    /* ======================================
       TITLE
    ====================================== */

    .company-promises__title {
        margin: 0 0 30px;
        color: #ffffff;
        font-size: 26px;
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
    }

    /* ======================================
       ACCORDION
    ====================================== */

    .company-promises__accordion {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .company-promises__item {
        position: relative;
        width: 100%;
        background: #ffffff;
        border-radius: 14px;
        overflow: hidden;
    }

    .company-promises__item-heading {
        margin: 0;
        padding: 0;
    }

    /* アコーディオンのクリック領域 */

    .company-promises__trigger {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;

        width: 100%;
        min-height: 75px;
        padding: 14px 15px;

        border: none;
        background: transparent;

        color: #111111;
        font: inherit;
        text-align: left;
        cursor: pointer;
    }

    .company-promises__item-title {
        min-width: 0;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.5;
    }

    /* ======================================
       PLUS / MINUS
    ====================================== */

    .company-promises__toggle {
        position: relative;
        display: block;

        width: 48px;
        height: 48px;
        flex: 0 0 48px;

        border-radius: 50%;
        background: #4ba447;

        transition: background-color .3s ease;
    }

    /* 横線 */

    .company-promises__toggle::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;

        width: 22px;
        height: 3px;

        background: #ffffff;
        border-radius: 2px;
        transform: translate(-50%, -50%);
    }

    /* 縦線 */

    .company-promises__toggle::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;

        width: 3px;
        height: 22px;

        background: #ffffff;
        border-radius: 2px;
        transform: translate(-50%, -50%);

        transition:
            opacity .3s ease,
            transform .3s ease;
    }

    /* 開いているときは「－」 */

    .company-promises__item.is-open
    .company-promises__toggle::after {
        opacity: 0;
        transform: translate(-50%, -50%) rotate(90deg);
    }

    .company-promises__trigger:hover
    .company-promises__toggle {
        background: #388f37;
    }

    .company-promises__trigger:focus-visible {
        outline: 3px solid #175d1d;
        outline-offset: -5px;
    }

    /* ======================================
       ACCORDION BODY
       高さはJavaScriptで制御
    ====================================== */

    .company-promises__body {
        height: 0;
        overflow: hidden;
        transition: height .42s cubic-bezier(.22, 1, .36, 1);
    }

    .company-promises__body-inner {
        padding: 0 18px 25px;
    }

    .company-promises__body-inner p {
        margin: 0;
        color: #111111;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.9;
    }

    /* ======================================
       DOT PATTERNS
    ====================================== */

    .company-promises__dots {
        position: absolute;
        z-index: 1;
        pointer-events: none;

        background-image: radial-gradient(
            circle,
            rgba(225, 255, 225, .75) 2.5px,
            transparent 3px
        );

        background-size: 12px 12px;
    }

    /* 右上のドット */

    .company-promises__dots--top {
        top: -35px;
        right: -15px;
        width: 150px;
        height: 110px;
        border-radius: 50%;
        transform: rotate(12deg);
    }

    /* 左中央のドット */

    .company-promises__dots--left {
        top: 230px;
        left: -70px;
        width: 170px;
        height: 180px;
        border-radius: 50%;
    }

    /* 右下のドット */

    .company-promises__dots--right {
        right: -65px;
        bottom: -45px;
        width: 170px;
        height: 190px;
        border-radius: 50%;
    }

    /* ======================================
       TRANSLUCENT CIRCLES
    ====================================== */

    .company-promises__circle {
        position: absolute;
        z-index: 0;
        border-radius: 50%;
        background: rgba(255, 255, 255, .20);
        pointer-events: none;
    }

    /* 右上の円 */

    .company-promises__circle--top {
        top: -35px;
        right: -25px;
        width: 110px;
        height: 110px;
    }

    /* 左下の円 */

    .company-promises__circle--left {
        bottom: 90px;
        left: -55px;
        width: 110px;
        height: 110px;
    }

    /* ======================================
       OUTSIDE ILLUSTRATIONS
    ====================================== */

    .company-promises__illust {
        position: absolute;
        z-index: 4;
        display: block;
        height: auto;
        max-width: none;
        object-fit: contain;
        pointer-events: none;
    }

    /* 左上：チェックリスト */

    .company-promises__illust--check {
        top: 10px;
        left: 5px;
        width: 55px;
    }

    /* 左中央：現場確認 */

    .company-promises__illust--inspection {
        top: 160px;
        left: -15px;
        width: 55px;
    }

    /* 左下：塗装道具 */

    .company-promises__illust--tools {
        bottom: -50px;
        left: -15px;
        width: 55px;
    }

    /* 右上：ヘルメットと図面 */

    .company-promises__illust--planning {
        top: 0;
        right: -15px;
        width: 60px;
    }

    /* 右下：オフィス */

    .company-promises__illust--office {
        bottom: -30px;
        right: -15px;
        width: 60px;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .company-philosophy {
        position: relative;
        width: 100%;
        padding: 45px 0 55px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-philosophy *,
    .company-philosophy *::before,
    .company-philosophy *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-philosophy__inner {
        position: relative;
        z-index: 2;

        width: calc(100% - 40px);
        max-width: 460px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-philosophy__heading {
        display: flex;
        align-items: baseline;
        gap: 10px;
        margin-bottom: 32px;
    }

    /* Philosophy */

    .company-philosophy__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(29px, 7.5vw, 39px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    /* 緑色のP */

    .company-philosophy__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Pの背面の薄緑円 */

    .company-philosophy__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -12px;
        left: -17px;

        width: 30px;
        height: 30px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 企業理念 */

    .company-philosophy__subtitle {
        margin: 0;
        color: #000000;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .company-philosophy__content {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 25px;
    }

    /* ======================================
       LEFT TEXT
    ====================================== */

    .company-philosophy__text {
        width: 100%;
        min-width: 0;
    }

    /* 大見出し */

    .company-philosophy__lead {
        margin: 0 0 22px;

        color: #000000;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.45;
        letter-spacing: 0;
    }

    /* PC用の改行を非表示 */

    .company-philosophy__lead br {
        display: none;
    }

    /* 本文 */

    .company-philosophy__body {
        width: 100%;
        max-width: 100%;
    }

    .company-philosophy__body p {
        margin: 0 0 15px;

        color: #111111;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.75;
        letter-spacing: 0;
    }

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

    /* ======================================
       RIGHT ILLUSTRATION
    ====================================== */

    .company-philosophy__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
        margin-top: 0;
    }

    .company-philosophy__visual img {
        display: block;
        width: 100%;
        max-width: 260px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       DOT DECORATION
    ====================================== */

    .company-philosophy__dots {
        position: absolute;
        z-index: 0;

        top: auto;
        bottom: 55px;
        right: -45px;

        width: 120px;
        height: 180px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 13px 13px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );
    }

    /* ======================================
       RIGHT BOTTOM CIRCLE
    ====================================== */

    .company-philosophy__circle {
        position: absolute;
        z-index: 0;

        right: -35px;
        bottom: 20px;

        width: 80px;
        height: 80px;

        border-radius: 50%;
        background: #eaf8ec;

        pointer-events: none;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .company-message {
        position: relative;
        width: 100%;
        padding: 50px 0 65px;
        background: #ffffff;
    }

    .company-message *,
    .company-message *::before,
    .company-message *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-message__inner {
        display: flex;
        flex-direction: column;

        width: calc(100% - 40px);
        max-width: 460px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .company-message__content {
        display: contents;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-message__heading {
        display: flex;
        align-items: baseline;
        gap: 10px;
        margin-bottom: 30px;
        order: 1;
    }

    .company-message__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(29px, 7.5vw, 39px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    .company-message__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Mの背面の薄緑円 */

    .company-message__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -12px;
        left: -17px;

        width: 30px;
        height: 30px;

        background: #eaf8ec;
        border-radius: 50%;
    }

    .company-message__subtitle {
        margin: 0;
        color: #000000;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       LOGO
    ====================================== */

    .company-message__visual {
        position: relative;
        order: 2;
        width: 100%;
        margin-bottom: 30px;
    }

    .company-message__sticky {
        position: static;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        padding: 0;
    }

    .company-message__sticky img {
        display: block;
        width: 100%;
        max-width: 220px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       MAIN HEADING
    ====================================== */

    .company-message__lead {
        order: 3;
        margin: 0 0 25px;

        color: #000000;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.45;
    }

    .company-message__lead br {
        display: none;
    }

    /* ======================================
       BODY
    ====================================== */

    .company-message__body {
        order: 4;
        width: 100%;
        max-width: 100%;
    }

    .company-message__body p {
        margin: 0 0 20px;
        color: #111111;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.85;
    }

    .company-message__body p:last-child {
        margin-bottom: 0;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .company-city {
        position: relative;
        width: 100%;
        padding: 25px 0 50px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-city *,
    .company-city *::before,
    .company-city *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-city__inner {
        position: relative;
        z-index: 2;

        width: calc(100% - 30px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       CITY ILLUSTRATION
    ====================================== */

    .company-city__visual {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        margin: 0 auto;
    }

    .company-city__visual img {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .company-city__dots {
        position: absolute;
        z-index: 0;

        right: -35px;
        bottom: -35px;

        width: 190px;
        height: 160px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 14px 14px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at center,
            #000 40%,
            transparent 100%
        );
    }
	    /* ======================================
       SECTION
    ====================================== */

    .company-profile {
        position: relative;
        width: 100%;
        padding: 50px 0 70px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .company-profile *,
    .company-profile *::before,
    .company-profile *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .company-profile__inner {
        position: relative;
        z-index: 2;

        width: calc(100% - 40px);
        max-width: 460px;
        margin: 0 auto;
    }

    /* ======================================
       HEADING
    ====================================== */

    .company-profile__heading {
        display: flex;
        align-items: baseline;
        gap: 10px;
        margin-bottom: 35px;
    }

    /* Company */

    .company-profile__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(29px, 7.5vw, 39px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: -0.045em;
    }

    /* 緑色のC */

    .company-profile__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* Cの背面の薄緑円 */

    .company-profile__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -12px;
        left: -17px;

        width: 30px;
        height: 30px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 企業概要 */

    .company-profile__subtitle {
        margin: 0;
        color: #000000;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       COMPANY LIST
    ====================================== */

    .company-profile__list {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    /* ======================================
       ROW
    ====================================== */

    .company-profile__row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;

        width: 100%;
        padding: 18px 0;

        border-bottom: 1px dashed #555555;
    }

    /* 項目名 */

    .company-profile__row dt {
        margin: 0;
        color: #111111;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.6;
    }

    /* 内容 */

    .company-profile__row dd {
        width: 100%;
        min-width: 0;
        margin: 0;

        color: #111111;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.85;
        overflow-wrap: anywhere;
    }

    /* 電話番号リンク */

    .company-profile__row dd a {
        color: inherit;
        text-decoration: none;
    }

    /* ======================================
       DOT DECORATIONS
    ====================================== */

    .company-profile__dots {
        position: absolute;
        z-index: 0;
        pointer-events: none;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 13px 13px;
        opacity: 0.6;
    }

    /* 右上 */

    .company-profile__dots--top {
        top: -35px;
        right: -40px;

        width: 150px;
        height: 180px;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 80% at top right,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 80% at top right,
            #000 40%,
            transparent 100%
        );
    }

    /* 左下 */

    .company-profile__dots--bottom {
        left: -35px;
        bottom: -45px;

        width: 160px;
        height: 130px;

        -webkit-mask-image: radial-gradient(
            ellipse 85% 80% at bottom left,
            #000 40%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 85% 80% at bottom left,
            #000 40%,
            transparent 100%
        );
    }

    /* ======================================
       RIGHT CIRCLE
    ====================================== */

    .company-profile__circle {
        position: absolute;
        z-index: 0;

        top: 65px;
        right: -45px;

        width: 110px;
        height: 110px;

        border-radius: 50%;
        background: #eaf8ec;
        pointer-events: none;
    }
	    .company-profile__map {
        position: relative;
        width: 100%;
        height: 260px;
        margin: 35px auto 0;
        overflow: hidden;
    }

    .company-profile__map iframe {
        display: block;
        width: 100%;
        height: 100%;
        border: none;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .service-fv {
        position: relative;
        width: 100%;
        min-height: auto;
        padding: 65px 0 60px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-fv *,
    .service-fv *::before,
    .service-fv *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-fv__inner {
        position: relative;
        z-index: 2;

        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 45px;

        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-fv__content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;

        width: 100%;
        min-width: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .service-fv__heading {
        display: flex;
        align-items: baseline;
        gap: 12px;
        margin-bottom: 28px;
    }

    /* SERVICE */

    .service-fv__title {
        position: relative;
        margin: 0;

        color: #000000;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(34px, 9vw, 48px);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.055em;
        white-space: nowrap;
    }

    /* GREEN S */

    .service-fv__title span {
        position: relative;
        z-index: 1;
        color: #008f00;
    }

    /* LIGHT GREEN CIRCLE */

    .service-fv__title span::before {
        content: "";
        position: absolute;
        z-index: -1;

        top: -14px;
        left: -16px;

        width: 40px;
        height: 40px;

        background: #eaf8ec;
        border-radius: 50%;
        pointer-events: none;
    }

    /* 事業内容 */

    .service-fv__subtitle {
        margin: 0;
        color: #111111;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-fv__description {
        width: 100%;
        max-width: 100%;
        margin: 0 0 30px;

        color: #111111;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: 0.01em;
    }

    /* ======================================
       CONTACT BUTTON
    ====================================== */

    .service-fv__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: center;

        min-width: 170px;
        min-height: 42px;
        padding: 10px 24px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 14px;
        font-weight: 800;
        line-height: 1.4;
        text-decoration: none;

        transition:
            background-color 0.3s ease,
            color 0.3s ease,
            transform 0.3s ease;
    }

    .service-fv__button:hover {
        background: #ffffff;
        color: #009900;
        transform: translateY(-2px);
    }

    .service-fv__button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }

    /* ======================================
       RIGHT VISUAL
    ====================================== */

    .service-fv__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-fv__visual img {
        display: block;
        width: 100%;
        max-width: 440px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .service-fv__dots {
        position: absolute;
        z-index: 0;

        top: 260px;
        right: -45px;

        width: 210px;
        height: 280px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 14px 14px;
        opacity: 0.6;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );
    }
    /* SECTION */

    .service-city {
        position: relative;
        width: 100%;
        padding: 20px 0 55px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-city *,
    .service-city *::before,
    .service-city *::after {
        box-sizing: border-box;
    }

    /* INNER */

    .service-city__inner {
        position: relative;
        z-index: 2;
        width: calc(100% - 30px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* IMAGE */

    .service-city__visual {
        width: 100%;
        height: 160px;
        margin: 0 auto;
        overflow: hidden;
        border-radius: 85px;
    }

    .service-city__visual img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    /* LEFT DOTS */

    .service-city__dots {
        position: absolute;
        z-index: 0;

        left: -35px;
        bottom: -10px;

        width: 180px;
        height: 160px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 14px 14px;
        opacity: 0.6;
        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at bottom left,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at bottom left,
            #000 45%,
            transparent 100%
        );
    }
	    /* ======================================
       SECTION
    ====================================== */

    .service-detail--01 {
        position: relative;
        width: 100%;
        padding: 55px 0 65px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-detail--01 *,
    .service-detail--01 *::before,
    .service-detail--01 *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-detail--01 .service-detail__inner {
        position: relative;
        z-index: 2;

        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 35px;

        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-detail--01 .service-detail__content {
        position: relative;
        width: 100%;
        min-width: 0;
    }

    /* ======================================
       HEADING
    ====================================== */

    .service-detail--01 .service-detail__heading {
        position: relative;
        margin-bottom: 28px;
    }

    /* Service01 */

    .service-detail--01 .service-detail__number {
        margin: 0 0 8px;

        color: #008f00;
        font-family: Arial, sans-serif;
        font-size: 20px;
        font-weight: 800;
        line-height: 1.2;
    }

    /* 現場監理事業 */

    .service-detail--01 .service-detail__title {
        margin: 0;

        color: #000000;
        font-size: clamp(26px, 7vw, 34px);
        font-weight: 800;
        line-height: 1.35;
        letter-spacing: 0.02em;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-detail--01 .service-detail__description {
        width: 100%;
        max-width: 100%;

        color: #111111;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: 0.01em;
    }

    .service-detail--01 .service-detail__description p {
        margin: 0 0 20px;
    }

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

    /* ======================================
       RIGHT IMAGE
    ====================================== */

    .service-detail--01 .service-detail__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-detail--01 .service-detail__visual img {
        display: block;
        width: 100%;
        max-width: 400px;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       LEFT DOT DECORATION
    ====================================== */

    .service-detail--01 .service-detail__dots {
        position: absolute;
        z-index: 0;

        top: -10px;
        left: -25px;

        width: 200px;
        height: 200px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 14px 14px;
        opacity: 0.5;

        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at top left,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at top left,
            #000 45%,
            transparent 100%
        );
    }
	    /* ======================================
       SECTION
    ====================================== */

    .service-features--01 {
        position: relative;
        width: 100%;
        padding: 30px 0 65px;
        background: #ffffff;
        overflow: hidden;
        isolation: isolate;
    }

    .service-features--01 *,
    .service-features--01 *::before,
    .service-features--01 *::after {
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-features--01 .service-features__inner {
        position: relative;
        z-index: 2;

        display: flex;
        flex-direction: column;
        gap: 60px;

        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       EACH FEATURE
    ====================================== */

    .service-features--01 .service-features__item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 25px;

        width: 100%;
    }

    /* ======================================
       LEFT CONTENT
    ====================================== */

    .service-features--01 .service-features__content {
        width: 100%;
        min-width: 0;
    }

    /* ======================================
       HEADING + GREEN LINE
    ====================================== */

    .service-features--01 .service-features__heading {
        display: flex;
        align-items: center;
        gap: 15px;

        width: 100%;
        margin-bottom: 18px;
    }

    .service-features--01 .service-features__title {
        flex-shrink: 0;
        margin: 0;

        color: #008f00;
        font-size: 20px;
        font-weight: 800;
        line-height: 1.3;
    }

    .service-features--01 .service-features__line {
        display: block;
        flex: 1;
        height: 1px;
        background: #299c37;
    }

    /* ======================================
       DESCRIPTION
    ====================================== */

    .service-features--01 .service-features__description {
        width: 100%;
        color: #111111;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: 0.01em;
    }

    .service-features--01 .service-features__description p {
        margin: 0 0 18px;
    }

    .service-features--01 .service-features__description p:last-child {
        margin-bottom: 0;
    }

    /* ======================================
       RIGHT IMAGE
    ====================================== */

    .service-features--01 .service-features__visual {
        position: relative;
        z-index: 2;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        min-width: 0;
    }

    .service-features--01 .service-features__visual img {
        display: block;
        width: 100%;
        max-width: 300px;
        height: auto;
        max-height: 220px;
        object-fit: contain;
    }

    /* ======================================
       RIGHT ELLIPSE
    ====================================== */

    .service-features--01 .service-features__ellipse {
        position: absolute;
        z-index: 0;

        right: -75px;
        bottom: 120px;

        width: 160px;
        height: 260px;

        border-radius: 50%;
        background: #eaf8ec;
        opacity: 0.8;
        pointer-events: none;
    }

    /* ======================================
       RIGHT DOT DECORATION
    ====================================== */

    .service-features--01 .service-features__dots {
        position: absolute;
        z-index: 1;

        right: -45px;
        bottom: 160px;

        width: 220px;
        height: 300px;

        background-image: radial-gradient(
            circle,
            #b9edc2 2.5px,
            transparent 3px
        );

        background-size: 14px 14px;
        opacity: 0.55;
        pointer-events: none;

        -webkit-mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );

        mask-image: radial-gradient(
            ellipse 90% 85% at center,
            #000 45%,
            transparent 100%
        );
    }
	    /* ======================================
       SECTION
    ====================================== */

    .service-contact-cta {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 55px 0 75px;
        background: #ffffff;
        overflow: hidden;
        box-sizing: border-box;
    }

    /* ======================================
       INNER
    ====================================== */

    .service-contact-cta__inner {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;
        max-width: 500px;
        margin: 0 auto;
        padding: 0 20px;

        box-sizing: border-box;
    }

    /* ======================================
       CONTENT
    ====================================== */

    .service-contact-cta__content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding: 0;

        text-align: center;
        box-sizing: border-box;
    }

    /* ======================================
       TEXT
    ====================================== */

    .service-contact-cta__text {
        display: block;
        width: 100%;
        margin: 0 0 40px;
        padding: 0;

        color: #111111;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: 0.01em;

        text-align: center;
        overflow-wrap: anywhere;
    }

    /* PC用の改行を非表示 */

    .service-contact-cta .pc-only {
        display: none;
    }

    /* ======================================
       CONTACT BUTTON
    ====================================== */

    .service-contact-cta__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: 190px;
        max-width: 100%;
        min-height: 45px;

        margin: 0 auto;
        padding: 10px 20px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;

        box-sizing: border-box;

        transition:
            background-color 0.3s ease,
            color 0.3s ease;
    }

    /* HOVER */

    .service-contact-cta__button:hover {
        background: #ffffff;
        color: #009900;
    }

    /* FOCUS */

    .service-contact-cta__button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }
	    /* ======================================
       SECTION
    ====================================== */

    .news-single {
        width: 100%;
        padding: 65px 0 85px;
        background: #ffffff;
        box-sizing: border-box;
    }

    .news-single *,
    .news-single *::before,
    .news-single *::after {
        box-sizing: border-box;
    }

    /* ======================================
       ARTICLE
    ====================================== */

    .news-single__article {
        width: calc(100% - 40px);
        max-width: 500px;
        margin: 0 auto;
    }

    /* ======================================
       HEADER
    ====================================== */

    .news-single__header {
        width: 100%;
        margin-bottom: 30px;
        padding-bottom: 20px;
        border-bottom: 1px solid #dddddd;
    }

    /* ======================================
       CATEGORY
    ====================================== */

    .news-single__categories {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 15px;
    }

    .news-single__category {
        display: inline-block;
        padding: 4px 12px;

        background: #eaf8ec;
        border-radius: 4px;

        color: #008f00;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.5;
    }

    /* ======================================
       TITLE
    ====================================== */

    .news-single__title {
        margin: 0 0 15px;

        color: #111111;
        font-size: clamp(20px, 5.5vw, 25px);
        font-weight: 800;
        line-height: 1.55;
        letter-spacing: 0.01em;

        overflow-wrap: anywhere;
    }

    /* ======================================
       DATE
    ====================================== */

    .news-single__date {
        display: block;

        color: #666666;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.5;
    }

    /* ======================================
       THUMBNAIL
    ====================================== */

    .news-single__thumbnail {
        width: 100%;
        margin-bottom: 35px;
        overflow: hidden;
    }

    .news-single__image {
        display: block;
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    /* ======================================
       ARTICLE CONTENT
    ====================================== */

    .news-single__content {
        width: 100%;

        color: #222222;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.95;
        letter-spacing: 0.01em;

        overflow-wrap: anywhere;
    }

    .news-single__content p {
        margin: 0 0 22px;
    }

    .news-single__content h2 {
        margin: 40px 0 20px;
        padding: 10px 14px;

        border-left: 4px solid #009900;
        background: #f0f8f0;

        color: #111111;
        font-size: 19px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content h3 {
        margin: 30px 0 18px;
        padding-bottom: 10px;

        border-bottom: 1px solid #009900;

        color: #111111;
        font-size: 17px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content h4 {
        margin: 25px 0 15px;

        color: #111111;
        font-size: 15px;
        font-weight: 800;
        line-height: 1.5;
    }

    .news-single__content ul,
    .news-single__content ol {
        margin: 18px 0 25px;
        padding-left: 23px;
    }

    .news-single__content li {
        margin-bottom: 8px;
    }

    .news-single__content img {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 25px auto;
    }

    .news-single__content a {
        color: #008f00;
        text-decoration: underline;
        text-underline-offset: 3px;
    }

    .news-single__content blockquote {
        margin: 25px 0;
        padding: 15px 18px;

        border-left: 4px solid #009900;
        background: #f7faf7;
    }

    .news-single__content blockquote p:last-child {
        margin-bottom: 0;
    }

    /* ======================================
       TABLE
    ====================================== */

    .news-single__content table {
        display: block;
        width: 100%;
        margin: 20px 0;
        border-collapse: collapse;
        overflow-x: auto;
    }

    .news-single__content th,
    .news-single__content td {
        padding: 10px;
        border: 1px solid #dddddd;
        text-align: left;
    }

    .news-single__content th {
        background: #f0f8f0;
    }

    /* ======================================
       BACK BUTTON
    ====================================== */

    .news-single__back {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-top: 55px;
    }

    .news-single__back-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: 190px;
        min-height: 45px;
        padding: 10px 20px;

        background: #009900;
        border: 1px solid #009900;
        border-radius: 10px;

        color: #ffffff;
        font-size: 14px;
        font-weight: 800;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;

        box-sizing: border-box;

        transition:
            background-color 0.3s ease,
            color 0.3s ease;
    }

    .news-single__back-button:hover {
        background: #ffffff;
        color: #009900;
    }

    .news-single__back-button:focus-visible {
        outline: 3px solid #006b00;
        outline-offset: 4px;
    }
	    .fv__bicycles {
        transform: translateX(15px);
    }
}






















/* ==========================================
   SMALL SMARTPHONE
   max-width: 375px
========================================== */

@media screen and (max-width: 375px) {

    .fv__inner {
        width: calc(100% - 28px);
    }

    .fv__title {
        font-size: 17px;
    }

    .fv__description {
        font-size: 10.5px;
        line-height: 1.75;
    }

    .fv__bicycle--01 {
        width: 40px;
    }

    .fv__bicycle--02 {
        width: 36px;
    }

    .fv__bicycle--03 {
        width: 38px;
    }

    .fv__bicycle--04 {
        width: 35px;
    }
	  .promises-section__inner {
        width: calc(100% - 36px);
    }

    .promises-section__heading-icon {
        width: 44px;
        transform: translateY(-13px);
    }

    .promises-section__title {
        font-size: 30px;
    }

    .promises-section__title::before {
        width: 44px;
        height: 44px;
        left: -22px;
        top: -8px;
    }

    .promises-section__box {
        min-height: 155px;
    }

    .promises-section__number {
        font-size: 43px;
    }

    .promises-section__item-title {
        font-size: 18px;
    }

    .promises-section__description p {
        font-size: 11px;
    }
}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

    .fv__bicycle {
        animation: none;
        opacity: 0;
    }
	    .service-card__overlay,
    .service-card__image img,
    .service-card__button,
    .service-card__title {
        transition: none;
    }
}