/* =====================
Reset
===================== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    font-family: "Zen Maru Gothic", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    color: #4A2A18;
    line-height: 1.8;
    letter-spacing: 0.04em;
    background: #fff;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

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

ul,
ol {
    list-style: none;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: none;
    cursor: pointer;
}

h1,
h2,
h3,
h4,
.global-nav a,
.site-footer__nav a {
    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
}

/* =====================
Common
===================== */
:root {
    --color-white: #FFFFFF;

    --color-blue: #4490CB;
    --color-orange: #FFA200;
    --color-pink: #E85262;
    --color-green: #90AA4D;

    --color-brown: #532300;
    --color-dark-brown: #321500;

    --color-bg: #F8F5EE;
}

.container {
    width: min(1440px, calc(100% - 80px));
    margin: 0 auto;
}

body.is-fixed {
    overflow: hidden;
}

/* sp/pc */
.sp {
    display: none;
}

.pc {
    display: block;
}

@media screen and (max-width: 1200px) {
    .container {
        width: calc(100% - 40px);
    }

    .sp {
        display: block;
    }

    .pc {
        display: none;
    }
}


/* =====================
Header
===================== */
.site-header {
    width: 100%;
    height: 157px;
    background: var(--color-white);
}

.site-header__inner {
    width: min(1340px, calc(100% - 100px));
    height: 100%;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-header__logo-area {
    flex-shrink: 0;
}

.site-header__logo {
    display: block;
    width: 235px;
}

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

.site-header__number {
    margin-top: 14px;

    font-family: "Zen Old Mincho", serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-dark-brown);
}

/* ---------------------
Navigation
--------------------- */
.global-nav {
    display: flex;
    align-items: center;
}

.global-nav__list {
    display: flex;
    align-items: center;
    gap: 30px;

    margin-left: 130px;
}

.global-nav__list a {
    font-family: "Zen Old Mincho", serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    color: var(--color-dark-brown);
    transition: color 0.3s ease;
}

.global-nav__list a:hover {
    color: var(--color-green);
}

/* ---------------------
Telephone
--------------------- */
.global-nav__contact {
    margin-left: 40px;

    text-align: center;
}

.global-nav__tel {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    font-family: "Zen Old Mincho", serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-dark-brown);
    transition: color 0.3s ease;
}

.global-nav__tel img {
    width: 17px;
    height: 17px;

    flex-shrink: 0;
}

.global-nav__tel:hover {
    color: var(--color-green);
}

.global-nav__contact p {
    margin-top: 8px;

    font-family: "Zen Old Mincho", serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-dark-brown);
}

/* ---------------------
Contact Button
--------------------- */
.global-nav__btn {
    width: 170px;
    height: 45px;

    margin-left: 30px;

    border-radius: 23px;

    background: var(--color-green);
    color: var(--color-white);

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    font-family: "Zen Old Mincho", serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;

    transition: background 0.3s ease, opacity 0.3s ease;
}

.global-nav__btn:hover {
    opacity: 0.8;
}

.global-nav__btn img {
    width: 18px;
    height: 12px;

    flex-shrink: 0;
}

/* ---------------------
Hamburger
--------------------- */
.hamburger {
    display: none;
}

/* =====================
SP
===================== */
@media screen and (max-width: 1200px) {

    .site-header {
        height: 90px;
    }

    .site-header__inner {
        width: calc(100% - 40px);
    }

    .site-header__logo {
        width: 180px;
    }

    .site-header__number {
        display: none;
    }

    .global-nav {
        position: fixed;
        top: 90px;
        right: -100%;
        z-index: 999;

        width: 100%;
        height: calc(100vh - 90px);

        display: block;

        background: var(--color-white);

        padding: 50px 30px;

        transition: right 0.4s ease;
    }

    .global-nav.is-open {
        right: 0;
    }

    .global-nav__list {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 28px;

        margin-left: 0;
    }

    .global-nav__list a {
        font-size: 18px;
    }

    .global-nav__contact {
        margin-left: 0;
        margin-top: 40px;
        text-align: center;
    }

    .global-nav__tel {
        justify-content: center;
    }

    .global-nav__contact p {
        margin-top: 8px;
    }

    .global-nav__btn {
        margin: 30px auto 0px auto;
    }

    .hamburger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 6px;

        position: relative;
        z-index: 1000;

        width: 40px;
        height: 40px;
    }

    .hamburger span {
        width: 100%;
        height: 2px;

        background: var(--color-dark-brown);
        border-radius: 999px;

        transition: transform 0.3s ease, opacity 0.3s ease;
    }

    .hamburger.is-open span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

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

    .hamburger.is-open span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }
}

/* =====================
Hero
===================== */
.top-hero {
    position: relative;
    width: 100%;
    height: 720px;
    overflow: hidden;
}

.top-hero__image {
    width: 100%;
    height: 100%;
}

.top-hero__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.top-hero__content {
    position: absolute;
    top: 50%;
    right: 120px;
    transform: translateY(-50%);

    color: var(--color-brown);
}

.top-hero__title {
    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
    line-height: 1.8;
    letter-spacing: 0.08em;
}

.top-hero__title-large,
.top-hero__title-pink,
.top-hero__title-green {
    font-size: 40px;
    font-weight: 700;
}

.top-hero__title-small {
    font-size: 30px;
    font-weight: 700;
}

.top-hero__title-pink {
    color: var(--color-pink);
}

.top-hero__title-green {
    color: var(--color-green);
}

.top-hero__text {
    margin-top: 40px;

    font-family: "Zen Maru Gothic", sans-serif;

    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.06em;

    color: var(--color-brown);
}

/* =====================
Hero SP
===================== */
@media screen and (max-width: 1200px) {
    .top-hero {
        height: 620px;
    }

    .top-hero__content {
        right: 40px;
    }
}

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

    .top-hero {
        height: 620px;
    }
    .top-hero__image img {
        object-position: 20% center;
    }

    .top-hero__content {
        position: absolute;

        left: 20px;
        right: 20px;
        bottom: 20px;

        top: auto;
        transform: none;

        text-align: center;

        background: rgba(255, 255, 255, 0.72);
        backdrop-filter: blur(4px);

        padding: 24px 20px;

        border-radius: 20px;
    }

    .top-hero__title {
        line-height: 1.7;
    }

    .top-hero__title-large,
    .top-hero__title-pink,
    .top-hero__title-green {
        font-size: 30px;
    }

    .top-hero__title-small {
        font-size: 23px;
    }

    .top-hero__text {
        margin-top: 20px;

        font-size: 15px;
        line-height: 1.9;
    }
}

/* =====================
Philosophy
===================== */
.top-philosophy {
    padding: 120px 0 60px 0;
    background: var(--color-white);
}

.top-philosophy__inner {
    width: min(1110px, calc(100% - 80px));
    margin: 0 auto;
}

.section-title--philosophy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;

    margin-bottom: 70px;
}

.section-title--philosophy h2 {
    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: var(--color-green);
}

.section-title__decor {
    width: 89px;
    height: 52px;
    object-fit: contain;
}

.section-title__decor--reverse {
    transform: scaleX(-1);
}

.philosophy-list {
    display: flex;
    justify-content: space-between;
    gap: 60px;
}

.philosophy-item {
    width: 330px;
    text-align: center;
}

.philosophy-item__image {
    height: 220px;

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

    margin-bottom: 40px;
}

.philosophy-item--mission .philosophy-item__image img {
    width: 155px;
}

.philosophy-item--vision .philosophy-item__image img {
    width: 160px;
}

.philosophy-item--value .philosophy-item__image img {
    width: 155px;
}

.philosophy-item h3 {
    width: 100%;
    height: 50px;

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

    border-radius: 5px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;

    color: var(--color-white);
}

.philosophy-item--mission h3 {
    background: var(--color-green);
}

.philosophy-item--vision h3 {
    background: var(--color-orange);
}

.philosophy-item--value h3 {
    background: var(--color-blue);
}

.philosophy-item p {
    width: fit-content;
    margin: 22px auto 0;

    max-width: 330px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.8;

    text-align: left;

    color: var(--color-brown);
}

/* =====================
Philosophy SP
===================== */
@media screen and (max-width: 768px) {

    .top-philosophy {
        padding: 80px 0;
    }

    .top-philosophy__inner {
        width: calc(100% - 40px);
    }

    .section-title--philosophy {
        gap: 12px;
        margin-bottom: 50px;
    }

    .section-title--philosophy h2 {
        font-size: 26px;
    }

    .section-title__decor {
        width: 60px;
        height: auto;
    }

    .philosophy-list {
        flex-direction: column;
        align-items: center;
        gap: 60px;
    }

    .philosophy-item {
        width: min(330px, 100%);
    }

    .philosophy-item__image {
        height: auto;
        margin-bottom: 28px;
    }

    .philosophy-item p {
        margin-top: 18px;
        font-size: 18px;
        line-height: 1.8;
    }
}

/* =====================
About
===================== */
.top-about {
    padding: 60px 0;
}

.top-about__bg {
    height: 438px;
    background: #F9F7F5;
}

.top-about__inner {
    width: min(1200px, calc(100% - 80px));
    height: 100%;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-about__text {
    width: 376px;
    flex-shrink: 0;
}

.top-about__title {
    display: flex;
    align-items: center;
    gap: 12px;
}

.top-about__title img {
    width: 35px;
    height: auto;
    flex-shrink: 0;
}

.top-about__title h2 {
    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-brown);

    white-space: nowrap;
}

.top-about__title h2 span {
    color: var(--color-green);
}

.top-about__text p {
    margin-top: 50px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.more-btn {
    position: relative;

    width: 200px;
    height: 50px;

    margin-top: 45px;

    border-radius: 28px;

    background: var(--color-green);
    color: var(--color-white);

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

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;

    transition: opacity 0.3s ease;
}

.more-btn--wide {
    width: 292px;
}

.more-btn--wide span {
    white-space: nowrap;
}

.more-btn:hover {
    opacity: 0.8;
}

.more-btn span {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.more-btn img {
    position: absolute;
    right: 20px;

    width: 7px;
    height: auto;
}

.top-about__image {
    width: 724px;
    height: 450px;

    margin-top: -104px;

    border-radius: 10px;
    overflow: hidden;

    box-shadow: 0 0 20px rgba(80, 80, 80, 0.6);
}

.top-about__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =====================
About SP
===================== */
@media screen and (max-width: 1200px) {

    .top-about {
        padding-bottom: 60px;
    }

    .top-about__bg {
        height: auto;
        padding: 70px 0;
    }

    .top-about__inner {
        width: calc(100% - 40px);
        flex-direction: column;
        gap: 50px;
    }

    .top-about__text {
        width: 100%;
        max-width: 500px;
        order: 1;
    }

    .top-about__image {
        width: 100%;
        max-width: 724px;
        height: auto;
        aspect-ratio: 724 / 450;

        margin-top: 0;

        order: 2;
    }
}

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

    .top-about__bg {
        padding: 60px 0;
    }

    .top-about__title h2 {
        font-size: 26px;
    }

    .top-about__text p {
        margin-top: 32px;
        font-size: 16px;
    }

    .more-btn {
        margin-top: 36px;
    }
}

/* =====================
Service
===================== */
.top-service {
    padding: 60px 0;
}

.top-service__inner {
    width: min(1100px, calc(100% - 80px));
    margin: 0 auto;
}

.top-service__title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.top-service__title img {
    width: 35px;
    height: auto;
}

.top-service__title img.reverse {
    transform: scaleX(-1);
}

.top-service__title h2 {
    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: var(--color-green);
}

.top-service__lead {
    margin-top: 45px;
    text-align: center;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.top-service__lead span {
    color: var(--color-pink);
    font-weight: 700;
}

.service-list {
    margin-top: 70px;

    display: flex;
    justify-content: center;
    gap: 50px;
}

.service-item {
    position: relative;

    width: 320px;
    text-align: center;
}

.service-item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: -25px;

    width: 1px;
    height: 340px;

    background: #B9B9B9;
}

.service-item:not(:last-child)::before {
    content: "";
    position: absolute;
    top: -2px;
    right: -27px;

    width: 5px;
    height: 5px;

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

    box-shadow: 0 340px 0 #B9B9B9;
    z-index: 1;
}

.service-item > img {
    height: 50px;
    width: auto;
    margin: 0 auto;
}

.service-item h3 {
    margin-top: 35px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 40px;
}

.service-item--green h3 {
    color: var(--color-green);
}

.service-item--orange h3 {
    color: var(--color-orange);
}

.service-item--blue h3 {
    color: var(--color-blue);
}

.service-item p {
    margin-top: 35px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;
    text-align: left;

    color: var(--color-brown);
}

.top-service-detail {
    margin-top: 90px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 55px;
}

.top-service-detail__image {
    width: 520px;
    flex-shrink: 0;
}

.top-service-detail__image img {
    width: 100%;
    height: auto;
}

.top-service-detail__content {
    flex: 1;
}

.top-service-detail__content h3 {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.8;

    color: var(--color-green);
}

.top-service-detail__content p {
    margin-top: 25px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.more-btn--wide {
    width: 292px;
}

/* =====================
Service SP
===================== */
@media screen and (max-width: 768px) {

    .top-service {
        padding: 80px 0;
    }

    .top-service__inner {
        width: calc(100% - 40px);
    }

    .top-service__title {
        gap: 10px;
    }

    .top-service__title h2 {
        font-size: 26px;
    }

    .top-service__lead {
        margin-top: 32px;
        text-align: left;
    }

    .service-list {
        margin-top: 55px;
        flex-direction: column;
        align-items: center;
        gap: 70px;
    }

    .service-item {
        width: 100%;
        max-width: 330px;
    }

    .service-item:not(:last-child)::after {
        top: auto;
        right: auto;
        left: 50%;
        bottom: -35px;

        width: 260px;
        height: 1px;

        transform: translateX(-50%);
    }

    .service-item:not(:last-child)::before {
        top: auto;
        right: auto;
        left: calc(50% - 130px);
        bottom: -37px;

        width: 5px;
        height: 5px;

        box-shadow: 260px 0 0 #B9B9B9;
    }

    .service-item h3 {
        margin-top: 28px;
        font-size: 19px;
        line-height: 1.8;
    }

    .service-item p {
        margin-top: 24px;
        font-size: 16px;
        text-align: center;
    }

    .top-service-detail {
        margin-top: 80px;
        flex-direction: column;
        gap: 40px;
    }

    .top-service-detail__image {
        width: 100%;
    }

    .top-service-detail__content {
        width: 100%;
    }

    .top-service-detail__content p {
        font-size: 16px;
    }

    .more-btn--wide {
        width: 292px;
        max-width: 100%;
    }
}

/* =====================
Recruit
===================== */
.top-recruit {
    padding: 120px 0;
}

.top-recruit__inner {
    position: relative;

    width: 100%;
    height: 510px;

    background: #F9F7F5;

    overflow: hidden;
}

.top-recruit__content {
    position: absolute;

    left: 200px;
    top: 50%;

    transform: translateY(-50%);

    width: 460px;
    z-index: 2;
}

.top-recruit__en {
    font-family: "Zen Old Mincho", serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-green);
}

.top-recruit__title {
    margin-top: 30px;

    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
    line-height: 44px;

    color: var(--color-brown);
}

.top-recruit__title .large {
    font-size: 30px;
}

.top-recruit__title {
    font-size: 25px;
}

.top-recruit__text {
    margin-top: 45px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.top-recruit__image {
    position: absolute;

    right: 0;
    top: 0;

    width: 823px;
    height: 510px;
}

.top-recruit__image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.recruit-table th .small {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}


/* =====================
Recruit SP
===================== */
@media screen and (max-width: 1200px) {

    .top-recruit__content {
        left: 80px;
    }

    .top-recruit__image {
        width: 60%;
    }
}

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

    .top-recruit {
        padding: 80px 0;
    }

    .top-recruit__inner {
        height: auto;

        display: flex;
        flex-direction: column;
    }

    .top-recruit__content {
        position: static;

        width: 100%;

        padding: 60px 20px;

        transform: none;
    }

    .top-recruit__image {
        position: static;

        width: 100%;
        height: auto;
    }

    .top-recruit__image img {
        height: auto;
    }

    .top-recruit__title {
        margin-top: 20px;
        line-height: 1.7;
    }

    .top-recruit__title .large {
        font-size: 28px;
    }

    .top-recruit__title {
        font-size: 23px;
    }

    .top-recruit__text {
        margin-top: 30px;
        font-size: 16px;
    }
}

/* =====================
News / Contact
===================== */
.top-news-contact {
    padding: 60px 0;
}

.top-news-contact__inner {
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;

    display: flex;
    align-items: center;
    gap: 46px;
}

.top-news {
    width: 500px;
    flex-shrink: 0;
}

.top-news__title {
    display: flex;
    align-items: center;
    gap: 14px;
}

.top-news__title img {
    width: 30px;
    height: auto;
}

.top-news__title h2 {
    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: var(--color-green);
}

.news-list {
    margin-top: 45px;
    width: 500px;
}

.news-list li {
    border-bottom: 1px solid var(--color-green);
}

.news-list a {
    position: relative;

    min-height: 62px;
    padding-right: 30px;

    display: grid;
    grid-template-columns: 130px 1fr;
    align-items: center;
    column-gap: 28px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);

    transition: color 0.3s ease;
}

.news-list a:hover {
    color: var(--color-green);
}

.news-list time {
    font: inherit;
}

.news-list img {
    position: absolute;
    right: 10px;
    top: 50%;

    width: 7px;
    height: auto;

    transform: translateY(-50%);

    filter: brightness(0) saturate(100%) invert(56%) sepia(18%) saturate(1105%) hue-rotate(37deg) brightness(93%) contrast(88%);
}

.top-news__btn {
    margin: 55px auto 0;
}

/* ---------------------
Contact card
--------------------- */
.top-contact-card {
    position: relative;

    width: 653px;
    height: 353px;

    background: #FAF7F3;
    border: 1px solid var(--color-green);

    overflow: hidden;
    flex-shrink: 0;
}

.top-contact-card__content {
    position: absolute;
    left: 40px;
    top: 50%;
    z-index: 2;

    width: 440px;

    transform: translateY(-50%);
}

.top-contact-card__content h2 {
    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.45;
    color: var(--color-green);
}

.top-contact-card__lead {
    margin-top: 22px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;
    color: var(--color-brown);
}

.top-contact-card__tel {
    margin-top: 18px;

    display: flex;
    align-items: center;
    gap: 12px;

    font-family: "Zen Old Mincho", serif;
    font-size: 37px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-brown);

    transition: color 0.3s ease;
}

.top-contact-card__tel:hover {
    color: var(--color-green);
}

.top-contact-card__tel img {
    width: 30px;
    height: auto;
}

.top-contact-card__time {
    margin-top: 12px;
    padding-left: 42px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-brown);
}

.more-btn--contact {
    width: 292px;
    margin-top: 26px;
}

.more-btn--contact span {
    white-space: nowrap;
}

.top-contact-card__image {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;

    width: 514px;
    height: 100%;

    object-fit: cover;
    object-position: right center;
}

/* =====================
News / Contact SP
===================== */
@media screen and (max-width: 1200px) {

    .top-news-contact__inner {
        width: calc(100% - 40px);
        flex-direction: column;
        gap: 60px;
    }

    .top-news,
    .news-list {
        width: 100%;
        max-width: 653px;
    }

    .top-contact-card {
        height: auto;
        min-height: 0;

        display: flex;
        flex-direction: column;

        overflow: hidden;
    }
}

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

    .top-news-contact {
        padding: 80px 0;
    }

    .top-news__title h2 {
        font-size: 26px;
    }

    .news-list {
        margin-top: 32px;
    }

    .news-list a {
        min-height: 74px;

        grid-template-columns: 1fr;

        padding-right: 28px;
        column-gap: 0;
        row-gap: 4px;
    }

    .news-list time {
        font-size: 15px;
    }

    .news-list span {
        font-size: 16px;
    }

    /* ---------------------
    Contact
    --------------------- */

    .top-contact-card {
        width: 100%;
        height: auto;
        min-height: 0;

        background: #FAF7F3;
    }

    .top-contact-card__content {
        position: static;

        width: 100%;

        padding: 40px 24px;

        background: #FAF7F3;

        transform: none;

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

        text-align: center;
    }

    .top-contact-card__image {
        display: none;
    }

    .top-contact-card__content h2 {
        font-size: 24px;
        line-height: 1.5;
    }

    .top-contact-card__lead {
        margin-top: 16px;

        font-size: 16px;
        line-height: 1.8;
    }

    .top-contact-card__tel {
        margin-top: 18px;

        justify-content: center;
        gap: 8px;

        font-size: 24px;
    }

    .top-contact-card__tel img {
        width: 22px;
    }

    .top-contact-card__time {
        margin-top: 10px;

        padding-left: 0;

        text-align: center;

        font-size: 12px;
    }

    .more-btn--contact {
        width: 260px;
        max-width: 100%;

        margin-top: 24px;
    }
}

/* =====================
Footer
===================== */
.footer {
    position: relative;
}

.footer-main {
    position: relative;

    height: 200px;

    background: #F9F7F5;
}

.footer-inner {
    width: calc(100% - 240px);
    max-width: 1200px;

    height: 100%;

    margin: 0 auto;

    display: flex;
    align-items: center;
}


.footer-logo img {
    width: 194px;
    height: auto;
}

.footer-office-number {
    margin-top: 16px;

    font-family: "Zen Old Mincho", serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-brown);
}

.footer-address {
    margin-left: 70px;
}

.footer-address p {
    font-family: "Zen Old Mincho", serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;

    color: var(--color-brown);
}

.footer-nav {
    margin-left: auto;
}

.footer-nav ul {
    display: flex;
    gap: 40px;

    list-style: none;
}

.footer-nav a {
    font-family: "Zen Old Mincho", serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-brown);

    transition: color .3s ease;
}

.footer-nav a:hover {
    color: var(--color-green);
}

/* ---------------------
Page Top
--------------------- */
.footer-top {
    position: absolute;

    top: -30px;
    right: 120px;

    width: 60px;
    height: 60px;

    border-radius: 50%;
    border: 1px solid transparent;

    background: var(--color-green);

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

    z-index: 10;

    transition:
        background .3s ease,
        border-color .3s ease;
}

.footer-top img {
    width: 10px;
    height: auto;
    transition: filter .3s ease;
}

.footer-top:hover img {
    filter: brightness(0) saturate(100%)
            invert(56%) sepia(18%)
            saturate(1105%)
            hue-rotate(37deg)
            brightness(93%)
            contrast(88%);
}

.footer-top:hover {
    background: #FFFFFF;
    border-color: var(--color-green);
}

/* ---------------------
Copyright
--------------------- */
.footer-copy {
    height: 40px;

    background: var(--color-green);

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

.footer-copy p {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;

    color: #FFFFFF;
}

/* =====================
Footer SP
===================== */
@media screen and (max-width: 768px) {

    .footer-main {
        height: auto;
        padding: 60px 20px;
    }

    .footer-inner {
        width: 100%;

        flex-direction: column;
    }

    .footer-address {
        margin-top: 30px;
        margin-left: 0;
    }

    .footer-nav {
        display: none;
    }

    .footer-nav ul {
        flex-direction: column;
        gap: 20px;
    }

    .footer-top {
        right: 20px;
    }
}

/* =====================
Lower MV
===================== */
.lower-mv {
    padding: 80px 0 0;
}

.lower-mv__inner {
    position: relative;

    width: min(1200px, calc(100% - 80px));
    height: 300px;
    margin: 0 auto;
}

.lower-mv__title {
    position: absolute;
    left: 0;
    top: 30px;
    z-index: 2;
}

.lower-mv__title p {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 80px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.05em;
    color: var(--color-brown);
}

.lower-mv__title h1 {
    margin-top: 38px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 30px;
    font-weight: 500;
    line-height: 1;
    color: #939393;
}

.lower-mv__tree {
    position: absolute;
    left: 350px;
    top: 0;
    width: 116px;
    height: auto;
}

.lower-mv__dotline {
    position: absolute;
    left: 0;
    bottom: 50px;
    width: 1200px;
    max-width: 100%;
    height: auto;
}

.breadcrumb {
    position: absolute;
    left: 0;
    bottom: 0;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    color: var(--color-green);
}

.breadcrumb a {
    color: var(--color-green);
    transition: color 0.3s ease;
}

.breadcrumb a:hover {
    opacity: .7;
}

.breadcrumb ol {
    display: flex;
    align-items: center;
    gap: 12px;
}

.breadcrumb li:not(:last-child)::after {
    content: "/";
    margin-left: 12px;
    color: var(--color-brown);
}

.breadcrumb li:last-child {
    color: var(--color-brown);
}

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

    .breadcrumb ol {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 6px 10px;
    }

    .breadcrumb li {
        line-height: 1.5;
    }

    .breadcrumb li:last-child {
        flex: 1;
        min-width: 0;
        word-break: break-word;
    }

}

/* =====================
News Archive
===================== */
.news-archive {
    padding: 60px 0 120px;
}

.news-archive__inner {
    width: min(1000px, calc(100% - 80px));
    margin: 0 auto;
}

.news-archive__filter {
    display: flex;
    justify-content: center;
    margin-bottom: 40px;
}

.news-archive__filter {
    display: flex;
    justify-content: center;

    margin-bottom: 40px;
}

.news-archive__filter select {

    width: 170px;
    height: 40px;

    padding: 0 40px 0 16px;

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

    background-color: #FFFFFF;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 14px;
    font-weight: 500;

    color: var(--color-brown);

    cursor: pointer;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image:
        linear-gradient(45deg, transparent 50%, var(--color-brown) 50%),
        linear-gradient(135deg, var(--color-brown) 50%, transparent 50%);

    background-position:
        calc(100% - 18px) 16px,
        calc(100% - 12px) 16px;

    background-size: 6px 6px;
    background-repeat: no-repeat;

    transition: border-color .3s ease;
}

.news-archive__filter select:hover {
    border-color: var(--color-green);
}

.news-archive__filter select:focus {
    outline: none;
    border-color: var(--color-green);
}

.news-archive-list {
    width: 1000px;
    max-width: 100%;
}

.news-archive-list li {
    border-bottom: 1px solid var(--color-green);
}

.news-archive-list a {
    position: relative;

    display: grid;
    grid-template-columns: 120px 1fr;
    column-gap: 40px;
    align-items: center;

    padding: 20px 28px 20px 0;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);

    transition: color 0.3s ease;
}

.news-archive-list a:hover {
    color: var(--color-green);
}

.news-archive-list time {
    font: inherit;
}

.news-archive-list img {
    position: absolute;
    right: 10px;
    top: 50%;

    width: 7px;
    height: auto;

    transform: translateY(-50%);

    filter: brightness(0) saturate(100%) invert(56%) sepia(18%) saturate(1105%) hue-rotate(37deg) brightness(93%) contrast(88%);
}

/* =====================
Lower / News SP
===================== */
@media screen and (max-width: 768px) {

    .lower-mv {
        padding-top: 50px;
    }

    .lower-mv__inner {
        width: calc(100% - 40px);
        height: 240px;
    }

    .lower-mv__title {
        top: 20px;
    }

    .lower-mv__title p {
        font-size: 48px;
    }

    .lower-mv__title h1 {
        margin-top: 24px;
        font-size: 22px;
    }

    .lower-mv__tree {
        left: auto;
        right: 20px;
        top: 0;
        width: 80px;
    }

    .lower-mv__dotline {
        bottom: 45px;
        width: 100%;
        max-width: 100%;
        height: auto;
    }

    .news-archive {
        padding: 40px 0 80px;
    }

    .news-archive__inner {
        width: calc(100% - 40px);
    }

    .news-archive-list a {
        grid-template-columns: 1fr;
        row-gap: 6px;

        padding: 18px 28px 18px 0;

        font-size: 16px;
    }

    .news-archive-list time {
        font-size: 15px;
    }
}

/* =====================
News Single
===================== */

.news-single {
    padding: 60px 0 120px;
}

.news-single__inner {
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
}

.news-single__date {
    display: block;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.news-single__title {
    margin-top: 10px;
    padding-bottom: 20px;

    border-bottom: 1px solid var(--color-green);

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 40px;

    color: var(--color-brown);
}

.news-single__body {
    margin-top: 40px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-dark-brown);
}

/* 本文 */

.news-single__body p {
    margin: 0;
}

/* リンク */

.news-single__body a {
    color: #3B6FD8;
    text-decoration: underline;

    transition: opacity .3s ease;
}

.news-single__body a:hover {
    opacity: .7;
}

/* 順序付きリスト */

.news-single__body ol {
    margin: 24px 0;
    padding-left: 3em;

    list-style: decimal;
    list-style-position: outside;
}

.news-single__body ol li {
    margin: 0;
}

/* 順序なしリスト */

.news-single__body ol {
    margin: 24px 0;
    padding-left: 3em;
}

.news-single__body li[data-list="ordered"] {
    list-style-type: decimal;
}

.news-single__body ol li[data-list="bullet"] {
    list-style-type: disc;
}

/* Quill 順序なしリスト */

.news-single__body li[data-list="bullet"] {
    list-style-type: disc;
}

.news-single__body li[data-list="bullet"]::marker {
    content: "• ";
}



/* 太字 */

.news-single__body strong,
.news-single__body b {
    font-weight: 700;
}

/* イタリック */

.news-single__body em,
.news-single__body i {
    font-style: italic;
}

/* 打ち消し */

.news-single__body s,
.news-single__body strike {
    text-decoration: line-through;
}

/* アンダーライン */

.news-single__body u {
    text-decoration: underline;
}

/* 画像 */

.news-single__body img {
    display: block;
    max-width: 100%;
    height: auto;

    margin: 24px 0;
}

.news-single__back {
    width: 244px;
    margin: 80px auto 0;
}

.news-single__back span {
    white-space: nowrap;
}

/* =====================
About Page
===================== */

.about-section-title {
    position: relative;

    padding-bottom: 22px;

    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-green);
}

.about-section-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;

    width: 30px;
    height: 2px;

    background: var(--color-green);
}

.about-section-title--center {
    display: table;

    margin: 0 auto;
}

.about-section-title--center::before {
    content: "";
    position: absolute;
    left: -50px;
    top: 14px;

    width: 30px;
    height: 2px;

    background: var(--color-green);
}

.about-section-title--center::after {
    left: auto;
    right: -50px;
    bottom: auto;
    top: 14px;
}

/* ---------------------
Message
--------------------- */
.about-message {
    width: min(1440px, calc(100% - 40px));
    margin: 60px auto 0;

    display: grid;
    grid-template-columns: 780px 600px;
    column-gap: 60px;
    align-items: center;
}

.about-message__image {
    width: 780px;
    height: 612px;
}

.about-message__image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}

.about-message__content {
    width: 600px;
}

.about-message__content p {
    margin-top: 35px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 40px;

    color: var(--color-brown);
}

.about-message__name {
    display: flex;
    justify-content: flex-end;

    margin-top: 20px;
}

.about-message__name p {
    margin: 0;

    font-family: "Zen Old Mincho", serif;
    line-height: 32px;
    text-align: left;
}
/* ---------------------
History
--------------------- */
.about-history {
    margin-top: 120px;
}

.about-history__list {
    position: relative;

    width: fit-content;
    margin: 70px auto 0;
}

.about-history__list::before {
    content: "";
    position: absolute;

    left: 9px;
    top: 10px;
    bottom: 10px;

    width: 2px;
    background: var(--color-green);
}

.about-history__item {
    position: relative;

    display: grid;
    grid-template-columns: 250px 1fr;
    column-gap: 90px;

    padding-left: 50px;
}

.about-history__item:not(:first-child) {
    margin-top: 80px;
}

.about-history__item::before {
    content: "";
    position: absolute;

    left: 0;
    top: 6px;

    width: 20px;
    height: 20px;

    border: 3px solid var(--color-green);
    border-radius: 50%;
    background: #fff;

    box-sizing: border-box;
    z-index: 2;
}

.about-history__year {
    font-family: "Zen Old Mincho", serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.8;

    color: var(--color-green);
}

.about-history__text {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}
/* ---------------------
Company
--------------------- */
.about-company {
    margin-top: 120px;
    padding-bottom: 120px;
}

.about-company__table-wrap {
    width: min(1000px, calc(100% - 40px));
    margin: 70px auto 0;
}

.about-company__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.about-company__table th,
.about-company__table td {
    padding: 20px 30px;

    border-top: 1px solid var(--color-brown);

    font-size: 18px;
    line-height: 1.8;

    color: var(--color-brown);
}

.about-company__table tr:last-child th,
.about-company__table tr:last-child td {
    border-bottom: 1px solid var(--color-brown);
}

.about-company__table th {
    width: 260px;

    background: #EFF4DD;

    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
    text-align: center;
}

.about-company__table td {
    width: 740px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 500;
}

/* =====================
About Page SP
===================== */
@media screen and (max-width: 1200px) {

    .about-message {
        width: calc(100% - 40px);

        display: flex;
        flex-direction: column;
        gap: 50px;

        align-items: center;
    }

        .about-message__image {
        width: 100%;
        max-width: 780px;
        height: auto;

        aspect-ratio: 780 / 612;
    }

    .about-message__content {
        width: 100%;
        max-width: 600px;
    }
}

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

    .about-section-title {
        font-size: 26px;
    }

    .about-message {
        margin-top: 50px;

        flex-direction: column;
        gap: 40px;
    }

    .about-message__image {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .about-message__content {
        width: calc(100% - 40px);
    }

    .about-message__content p {
        margin-top: 28px;

        font-size: 16px;
        line-height: 2;
    }

    .about-message__name p {
        line-height: 1.8;
    }

    .about-history {
        margin-top: 80px;
    }

    .about-history__list {
        width: calc(100% - 40px);
        margin-top: 50px;
    }

    .about-history__list::before {
        height: calc(100% - 20px);
    }

    .about-history__item {
        display: block;
        padding-left: 45px;
    }

    .about-history__item:not(:first-child) {
        margin-top: 50px;
    }

    .about-history__year,
    .about-history__text {
        font-size: 16px;
    }

    .about-history__text {
        margin-top: 10px;
    }

    .about-company {
        margin-top: 80px;
        padding-bottom: 80px;
    }

    .about-company__table-wrap {
        margin-top: 50px;
    }

    .about-company__table,
    .about-company__table tbody,
    .about-company__table tr,
    .about-company__table th,
    .about-company__table td {
        display: block;
        width: 100%;
    }

    .about-company__table tr {
        border-top: 1px solid var(--color-brown);
    }

    .about-company__table tr:last-child {
        border-bottom: 1px solid var(--color-brown);
    }

    .about-company__table th,
    .about-company__table td {
        border: none;
        padding: 16px 20px;

        font-size: 16px;
    }

    .about-company__table th {
        text-align: left;
    }
}

/* =====================
Service Page
===================== */

/* ---------------------
Service About
--------------------- */

.service-about {
    padding: 60px 0 120px;
}

.service-about__title {
    margin-bottom: 50px;

    text-align: center;

    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-brown);
}

.service-about__title span {
    color: var(--color-green);
}

.service-about__inner {
    width: fit-content;
    margin: 0 auto;

    display: flex;
    align-items: center;
    gap: 30px;
}

.service-about__text {
    width: 440px;
}

.service-about__text p {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;

    color: var(--color-brown);
}

.service-about__image {
    width: 400px;
    flex-shrink: 0;
}

.service-about__image img {
    display: block;

    width: 100%;
    height: auto;
}

/* =====================
Service About SP
===================== */

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

    .service-about {
        padding: 50px 0 80px;
    }

    .service-about__title {
        margin-bottom: 40px;
        font-size: 26px;
    }

    .service-about__inner {
        width: calc(100% - 40px);

        flex-direction: column-reverse;
        gap: 40px;
    }

    .service-about__text,
    .service-about__image {
        width: 100%;
        max-width: 440px;
    }

    .service-about__text p {
        font-size: 18px;
        line-height: 1.8;
    }
}
/* ---------------------
Service Flow
--------------------- */
.service-flow {
    padding-bottom: 120px;
}

.service-flow__inner {
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
}

.service-flow__lead {
    margin-top: 40px;

    text-align: center;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.service-flow__note {
    margin-top: 25px;

    text-align: center;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.service-flow-list {
    margin-top: 60px;
}

.service-flow-item {
    position: relative;

    display: grid;
    grid-template-columns: 80px 306px 1fr;
    align-items: center;
    column-gap: 50px;

    padding: 45px 0;
}

.service-flow-item::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;

    width: 100%;
    height: 1px;

    background: #B9B9B9;
}

.service-flow-item::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;

    width: 5px;
    height: 5px;

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

    box-shadow: 1195px 0 0 #B9B9B9;
    z-index: 1;
}

.service-flow-item__num {
    font-family: "Zen Old Mincho", serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1;

    color: var(--color-green);
}

.service-flow-item__image {
    width: 306px;
}

.service-flow-item__image img {
    width: 100%;
    height: auto;
}

.service-flow-item__text h3 {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.6;

    color: var(--color-orange);
}

.service-flow-item__text p {
    margin-top: 30px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

/* ---------------------
Service Request
--------------------- */
.service-request {
    padding-bottom: 120px;
}

.service-request__inner {
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
}

.service-request__lead {
    margin-top: 40px;

    text-align: center;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.service-request-list {
    margin-top: 50px;

    display: flex;
    justify-content: center;
    gap: 30px;
}

.service-request-card {
    width: 380px;
    min-height: 550px;

    padding: 45px 38px;

    background: #F9F7F5;

    text-align: center;
}

.service-request-card img {
    width: 50px;
    height: 50px;

    margin: 0 auto;
}

.service-request-card h3 {
    margin-top: 28px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.5;

    color: var(--color-orange);
}

.service-request-card ol {
    margin-top: 32px;
    padding-left: 0;

    list-style: none;

    text-align: left;
}

.service-request-card li {
    position: relative;

    padding-left: 2em;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 27px;

    color: var(--color-brown);
}

.service-request-card li + li {
    margin-top: 18px;
}

.service-request-card li::before {
    position: absolute;
    left: 0;
    top: 0;
}

.service-request-card li:nth-child(1)::before {
    content: "①";
}

.service-request-card li:nth-child(2)::before {
    content: "②";
}

.service-request-card li:nth-child(3)::before {
    content: "③";
}

.service-request-card li:nth-child(4)::before {
    content: "④";
}

.service-request-card li::before {
    position: absolute;
    left: 0;
    top: 0;
}

/* =====================
Service Page SP
===================== */
@media screen and (max-width: 1200px) {

    .service-flow-item::before {
        box-shadow: calc(100vw - 85px) 0 0 #B9B9B9;
    }

    .service-request-list {
        flex-direction: column;
        align-items: center;
    }
}

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

    .service-about {
        padding: 50px 0 80px;
    }

    .service-about__inner {
        width: calc(100% - 40px);

        flex-direction: column;
        gap: 40px;
    }

    .service-about__text {
        width: 100%;
    }

    .service-about__text h2 {
        font-size: 26px;
        text-align: center;
    }

    .service-about__text p {
        margin-top: 32px;

        font-size: 16px;
        line-height: 1.9;
    }

    .service-about__image {
        width: 100%;
        max-width: 400px;
    }

    .service-flow {
        padding-bottom: 80px;
    }

    .service-flow__inner,
    .service-request__inner {
        width: calc(100% - 40px);
    }

    .service-flow__lead,
    .service-request__lead {
        margin-top: 32px;
        font-size: 16px;
    }

    .service-flow__note {
        font-size: 13px;
    }

    .service-flow-list {
        margin-top: 40px;
    }

    .service-flow-item {
        grid-template-columns: 1fr;
        row-gap: 22px;

        padding: 40px 0;

        text-align: center;
    }

    .service-flow-item__num {
        font-size: 36px;
    }

    .service-flow-item__image {
        width: 100%;
        max-width: 306px;

        margin: 0 auto;
    }

    .service-flow-item__text h3 {
        font-size: 22px;
    }

    .service-flow-item__text p {
        margin-top: 20px;

        font-size: 16px;
        text-align: left;
    }

    .service-flow-item::before {
        box-shadow: calc(100vw - 45px) 0 0 #B9B9B9;
    }

    .service-request {
        padding-bottom: 80px;
    }

    .service-request-list {
        margin-top: 40px;
    }

    .service-request-card {
        width: 100%;
        min-height: auto;

        padding: 40px 28px;
    }

    .service-request-card h3 {
        font-size: 22px;
    }

    .service-request-card li {
        font-size: 16px;
        line-height: 1.8;
    }
}

/* =====================
Recruit Page
===================== */

/* ---------------------
Recruit Main
--------------------- */
.recruit-main {
    padding: 60px 0 120px;
}

.recruit-main__inner {
    width: min(1440px, calc(100% - 40px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: 390px 823px;
    column-gap: 30px;
    justify-content: center;
    align-items: center;
}
.recruit-main__content {
    width: 390px;
}

.recruit-main__content h2 {
    position: relative;

    padding-bottom: 20px;
    margin-bottom: 40px;

    font-family: "Zen Old Mincho", serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.8;

    color: var(--color-brown);
}

.recruit-main__content h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;

    width: 30px;
    height: 2px;

    background: var(--color-green);
}

.recruit-main__content p {
    margin-top: 0;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

.recruit-main__image {
    width: 823px;
    height: 371px;
}

.recruit-main__image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}

/* ---------------------
Recruit Main SP
--------------------- */
@media screen and (max-width: 1200px) {

    .recruit-main__inner {
        display: flex;
        flex-direction: column;
        gap: 50px;

        width: calc(100% - 40px);
    }

    .recruit-main__content {
        width: 100%;
        max-width: 520px;
    }

    .recruit-main__image {
        width: 100%;
        max-width: 823px;
        height: auto;
        aspect-ratio: 823 / 371;
    }
}

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

    .recruit-main {
        padding: 50px 0 80px;
    }

    .recruit-main__content h2 {
        font-size: 26px;
        line-height: 1.7;
    }

    .recruit-main__content p {
        font-size: 16px;
    }
}
/* ---------------------
Recruit Merit
--------------------- */
.recruit-merit {
    padding-bottom: 120px;
}

.recruit-merit__inner {
    width: min(1000px, calc(100% - 80px));
    margin: 0 auto;
}

.recruit-merit-list {
    margin-top: 60px;

    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.recruit-merit-card {
    min-height: 180px;

    padding: 28px 18px;

    background: #F9F7F5;

    text-align: center;
}

.recruit-merit-card img {
    width: 50px;
    height: 50px;

    margin: 0 auto;
}

.recruit-merit-card h3 {
    margin-top: 20px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;

    color: var(--color-green);
}

.recruit-merit-card p {
    margin-top: 18px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.7;

    color: var(--color-brown);
}

.recruit-merit__text {
    margin-top: 45px;
}

.recruit-merit__text p {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.8;

    color: var(--color-brown);
}

/* ---------------------
Recruit Guideline
--------------------- */
.recruit-guideline {
    padding-bottom: 80px;
}

.recruit-guideline__inner {
    width: min(1000px, calc(100% - 40px));
    margin: 0 auto;
}

.recruit-table-wrap {
    margin-top: 70px;
}

.recruit-table {
    width: 100%;

    border-collapse: collapse;
    table-layout: fixed;
}

.recruit-table th,
.recruit-table td {
    padding: 20px 30px;

    border-top: 1px solid var(--color-brown);

    font-size: 18px;
    line-height: 1.8;

    color: var(--color-brown);
}

.recruit-table tr:last-child th,
.recruit-table tr:last-child td {
    border-bottom: 1px solid var(--color-brown);
}

.recruit-table th {
    width: 260px;

    background: #EFF4DD;

    font-family: "Zen Old Mincho", serif;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
}

.recruit-table td {
    width: 740px;

    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 500;
}

/* ---------------------
Recruit Contact
--------------------- */
.recruit-contact {
    padding-bottom: 120px;
}

.recruit-contact .top-contact-card {
    margin: 0 auto;
}

/* =====================
Recruit Page SP
===================== */
@media screen and (max-width: 1200px) {

    .recruit-main__inner {
        flex-direction: column;
        gap: 50px;
    }

    .recruit-main__content {
        width: 100%;
        max-width: 520px;
    }

    .recruit-main__image {
        width: 100%;
        max-width: 620px;
    }

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

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

    .recruit-main {
        padding: 50px 0 80px;
    }

    .recruit-main__inner {
        width: calc(100% - 40px);
    }

    .recruit-main__content h2 {
        font-size: 26px;
        line-height: 1.7;
    }

    .recruit-main__content p {
        margin-top: 30px;
        font-size: 16px;
    }

    .recruit-merit {
        padding-bottom: 80px;
    }

    .recruit-merit__inner {
        width: calc(100% - 40px);
    }

    .recruit-merit-list {
        margin-top: 50px;

        grid-template-columns: 1fr;
        gap: 20px;
    }

    .recruit-merit-card {
        min-height: auto;
        padding: 35px 24px;
    }

    .recruit-merit__text p {
        font-size: 16px;
    }

    .recruit-guideline {
        padding-bottom: 60px;
    }

    .recruit-table,
    .recruit-table tbody,
    .recruit-table tr,
    .recruit-table th,
    .recruit-table td {
        display: block;
        width: 100%;
    }

    .recruit-table tr {
        border-top: 1px solid var(--color-brown);
    }

    .recruit-table tr:last-child {
        border-bottom: 1px solid var(--color-brown);
    }

    .recruit-table th,
    .recruit-table td {
        border: none;

        padding: 16px 20px;

        font-size: 16px;
    }

    .recruit-table th {
        text-align: left;
    }

    .recruit-contact {
        padding-bottom: 80px;
    }

    .recruit-contact .top-contact-card {
        width: calc(100% - 40px);
    }
}

/* =====================
Contact Page
===================== */

.contact-section {
    padding: 60px 0 120px;
}

.contact-section__inner {
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
}

.contact-lead {
    text-align: center;
}

.contact-lead p {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 2;

    color: var(--color-brown);
}

.contact-lead p + p {
    margin-top: 38px;
}

.contact-form-box {
    margin-top: 80px;

    background: #F9F7F5;
}

.contact-form-iframe {
    display: block;

    width: 100%;
    min-height: 900px;
}

/* =====================
Contact Page SP
===================== */
@media screen and (max-width: 768px) {

    .contact-section {
        padding: 50px 0 80px;
    }

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

    .contact-lead {
        text-align: left;
    }

    .contact-lead p {
        font-size: 16px;
        line-height: 1.9;
    }

    .contact-form-box {
        margin-top: 50px;
    }

    .contact-form-iframe {
        min-height: 1000px;
    }
}

.error404{
    padding:140px 20px;
}

.error404__inner{
    max-width:700px;
    margin:auto;
    text-align:center;
}

.error404__num{
    font-family:"Zen Old Mincho";
    font-size:110px;
    color:var(--color-green);
    line-height:1;
}

.error404 h1{
    margin-top:30px;

    font-family:"Zen Old Mincho";
    font-size:40px;
    line-height:1.6;
    color:var(--color-brown);
}

.error404__text{
    margin-top:35px;

    font-family:"Zen Maru Gothic";
    font-size:18px;
    line-height:2;
    color:var(--color-brown);
}

.error404 .more-btn{
    margin:50px auto 0;
}

@media(max-width:768px){

.error404{
    padding:90px 20px;
}

.error404__num{
    font-size:70px;
}

.error404 h1{
    font-size:28px;
}

.error404__text{
    font-size:16px;
}

}