@charset "utf-8";

/* 20241218 TOPページの改修 */
/* =======================
共通
======================= */
:root {
    --clr_primary: #013575;
    --clr_text_gray: #6c6c6c;
}

/* インナー */
.home-new .c-inner {
    margin-inline: auto;
    max-width: 1000px;
}

/* タイトル */
.home-new .c-head-line {
    margin-bottom: 24px;
    padding: 0 0 8px 20px;
    font-size: 22px;
    font-weight: 700;
    border-bottom: 2px solid #dfdfdf;
    position: relative;
}
.home-new .c-head-line::before {
    content: "";
    width: 7px;
    height: calc(100% - 20px);
    position: absolute;
    top: 0.25em;
    left: 0;
    background-color: #237f52;
}

/* 背景ありセクション */
.c-bg-sec {
    padding: 8px;
    background-color: #b4cae5;
    border-radius: 8px;
}

.c-bg-sec-inner {
    padding: 32px 50px;
    background-color: #fff;
}

.c-bg-sec-title {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.c-bg-sec-text {
    margin-bottom: 20px;
    font-size: 15px;
}

.c-bg-sec-link {
    text-align: center;
}
.c-bg-sec-link-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s ease-in-out;
    transition-property: opacity;
}
.c-bg-sec-link-btn:hover {
    opacity: 0.6;
}

/*  cv
======================= */
.c-home-cv {
    padding-block: 60px;
    background-color: var(--clr_primary);
}
.c-home-cv__wrap {
    padding: 40px;
    background-color: #f5f5f5;
}
/* タイトル */
.c-home-cv__wrap-title {
    margin: 0 auto 16px;
    width: fit-content;
    font-size: 20px;
    font-weight: 700;
    position: relative;
}
.c-home-cv__wrap-title::before,
.c-home-cv__wrap-title::after {
    content: "";
    width: 2px;
    height: 20px;
    background-color: var(--clr_primary);
    position: absolute;
    bottom: 0.3em;
    translate: -4px;
}
.c-home-cv__wrap-title::before {
    right: 100%;
    rotate: -45deg;
    transform-origin: left bottom;
}
.c-home-cv__wrap-title::after {
    left: 100%;
    rotate: 45deg;
    transform-origin: right bottom;
}
/* cvコンテナ */
.c-home-cv__wrap-container {
    margin-bottom: 10px;
    display: flex;
    gap: 32px;
}
.c-home-cv__wrap-item {
    padding: 8px 8px 16px;
    background-color: #fff;
    border: 1px solid #dfdfdf;
    flex: 1;
}
.c-home-cv__wrap-item-title {
    margin-bottom: 16px;
    padding: 8px 16px;
    color: #fff;
    background-color: #237f52;
    font-size: 16px;
    font-weight: 700;
}
.c-home-cv__wrap-item-link {
    display: flex;
    justify-content: center;
}
.c-home-cv__wrap-item-link-btn {
    transition: 0.3s ease-in-out;
    transition-property: opacity;
}
.c-home-cv__wrap-item-link-btn:hover {
    opacity: 0.6;
}

/* 注釈 */
.c-home-cv__wrap-caution {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
}
.c-home-cv__wrap-caution svg {
    display: flex;
    justify-content: center;
    align-items: center;
}
/* 注意事項 */
.c-home-cv__sub-title {
    margin-block: 40px 20px;
    padding-left: 14px;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    position: relative;
}
.c-home-cv__sub-title::before {
    content: "";
    width: 4px;
    height: 18px;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 50%;
    translate: 0 -50%;
}
.c-home-cv__text {
    margin-bottom: 16px;
    font-size: 16px;
    color: #fff;
}
.c-home-cv__list {
    padding: 16px 40px;
    background-color: #fff;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px 56px;
}
.c-home-cv__list-item {
    padding-left: 12px;
    position: relative;
}
.c-home-cv__list-item::before {
    content: "";
    width: 4px;
    height: 4px;
    background-color: currentColor;
    position: absolute;
    left: 0;
    top: 50%;
    translate: 0 calc(-50% - 1px);
    border-radius: 50%;
}

/*  製品型番記載箇所について
======================= */
.c-model-numberWrap {
    margin-block: 64px 100px;
}
.c-model-number {
    padding: 8px;
    background-color: #dfdfdf;
}
.c-model-number__inner {
    padding: 32px 50px;
    background-color: #fff;
}
/* たいとる */
.c-model-number__title {
    margin-bottom: 16px;
}
/* 中身 */
.c-model-number__wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}
/* テキスト */
.c-model-number__textWrap {
    font-size: 16px;
}
/* 画像 */
.c-model-number__img {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

/* =============================
  header
============================= */
#gNav li:nth-child(4) a {
    width: 149px;
}
#gNav li:nth-child(5) a {
    width: 203px;
}

/* =======================
下記メーカー以外のパーツもご相談ください
======================= */
.home-parts {
    margin-top: -120px;
    margin-inline: auto;
    max-width: 1440px;
    background: url(../img/new/img-bg.png) no-repeat center / 100%;
    position: relative;
    z-index: 1;
}

.home-parts .home-parts__title {
    padding-block: 34px 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 34px;
    color: #fff;
    background-color: var(--clr_primary);
}

.home-parts .home-parts__wrap {
    margin-inline: auto;
    padding-block: 24px 50px;
    max-width: 1000px;
}

.home-parts .home-parts__imgWrap {
    margin-bottom: 16px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
}

.home-parts .home-parts__text {
    display: grid;
    grid-template-columns: auto 1fr;
    color: var(--clr_text_gray);
    line-height: 1.5;
}

.home-parts .home-parts__text + .home-parts__text {
    margin-top: 10px;
}

/* =======================
取扱修理部品
======================= */
.home-repair {
    margin-top: 100px;
}

.home-repair .home-repair__text {
    font-size: 16px;
}

.home-repair .home-repair__wrap {
    margin-top: 50px;
}

.home-repair .home-repair__imgWrap {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px 16px;
}

.home-repair .home-repair__imgWrap figcaption {
    margin-top: 8px;
    font-size: 16px;
    text-align: center;
}

.home-repair .home-repair__hurry {
    margin-top: 50px;
}

/* =======================
代替部品について
======================= */
.home-alternative {
    margin-block: 100px;
}

.home-alternative .home-alternative__wrap {
    display: grid;
    grid-template-columns: 400px 1fr;
    gap: 40px;
    align-items: center;
}

.home-alternative .home-alternative__body-bg {
    margin-bottom: 24px;
    padding: 24px 32px;
    background-color: #f5f5f5;
    font-size: 16px;
}

.home-alternative .home-alternative__body-bg-strong {
    margin-bottom: 12px;
    color: var(--clr_primary);
    font-weight: 700;
}

.home-alternative .home-alternative__body-text {
    font-size: 16px;
}
.home-alternative .home-alternative__body-text .-caution {
    margin-top: 12px;
    font-size: 14px;
    color: #6c6c6c;
}

/* =======================
このようなニーズに対応しています。
======================= */
.home-blue-bg {
    padding-block: 100px;
    background: url(../img/new/img-bg.png) repeat center / 100%;
}

.home-needs {
    margin-bottom: 100px;
}
.home-needs .home-needs__wrap {
    margin-bottom: 50px;
    display: grid;
    grid-template-columns: 400px 1fr;
    align-items: center;
    gap: 40px;
}
.home-needs .home-needs__item-list {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.home-needs .home-needs__item-list li {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 18px;
    font-weight: 700;
}
.home-needs .home-needs__caution {
    color: #6c6c6c;
}
.home-needs .home-needs__bg-wrap {
    display: grid;
    grid-template-columns: 1fr 320px;
    align-items: center;
    gap: 40px;
    font-size: 16px;
}

/* =======================
取扱メーカー
======================= */
.home-maker {
    margin-bottom: 64px;
}
.home-maker .home-maker__title {
    margin-block: 40px 20px;
}
.home-maker .home-marker__imgWrap {
    margin-bottom: 16px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
}
.home-maker .home-marker__text {
    display: grid;
    grid-template-columns: auto 1fr;
    color: var(--clr_text_gray);
    line-height: 1.5;
    font-size: 14px;
}
.home-maker .home-marker__text + .home-marker__text {
    margin-top: 10px;
}

/* =======================
ご依頼の流れ
======================= */
.home-flow {
    margin-block: 100px 80px;
}
.home-flow .home-flow__img {
    margin-bottom: 64px;
}

/* 流れ */
.home-flow .home-flow__list {
    margin-bottom: 50px;
    display: flex;
    flex-direction: column;
    gap: 64px;
}
.home-flow .home-flow__list-item {
    padding: 50px 50px 30px;
    background-color: #f5f5f5;
    position: relative;
}
.home-flow .home-flow__list-item:not(:last-of-type)::after {
    content: "";
    width: 80px;
    height: 32px;
    background-color: var(--clr_primary);
    clip-path: polygon(100% 0, 0 0, 50% 100%);
    position: absolute;
    left: 50%;
    top: calc(100% + 16px);
    translate: -50%;
}
.home-flow .home-flow__list-item-label {
    position: absolute;
    left: -3px;
    top: -3px;
}
.home-flow .home-flow__list-item-wrap {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 40px;
}
.home-flow .home-flow__list-item-wrap-text {
    font-size: 16px;
}
.home-flow__bg {
    margin-top: 24px;
}

/* 最初のリスト */
.home-flow__cv {
    margin-top: 32px;
}
.home-flow__bg-wrap {
    display: grid;
    grid-template-columns: 1fr 275px;
    gap: 32px;
}

/* テーブル */
.home-flow .home-flow__list-item-wrap-tableWrap {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.home-flow .home-flow__list-item-wrap-table {
    border-collapse: collapse;
}
.home-flow .home-flow__list-item-wrap-table th,
.home-flow .home-flow__list-item-wrap-table td {
    padding: 12px 20px;
    border: 1px solid #dfdfdf;
    text-align: start;
    vertical-align: top;
}
.home-flow .home-flow__list-item-wrap-table th {
    width: 112px;
}
.home-flow .home-flow__list-item-wrap-table td {
    background-color: #fff;
}

/* 注釈 */
.home-flow__list-item-wrap-text .-caution {
    margin-top: 12px;
    color: #6c6c6c;
    font-size: 14px;
}

/* 初期不良時の対応 */
.home-flow__bg-text {
    margin-bottom: 20px;
    font-size: 16px;
}
.home-flow__bg-text sup {
    font-size: 70%;
    vertical-align: top;
    position: relative;
    top: -0.1em;
}
.home-flow__bg-cautionWrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.home-flow__bg-caution {
    display: grid;
    grid-template-columns: 2.1em 1fr;
    font-size: 14px;
    color: #6c6c6c;
}

/* =======================
SNS
======================= */
.p-home__sns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.p-home__sns-item {
    display: flex;
    justify-content: center;
}

/* =======================
footer
======================= */
.l-footer .contentRight {
    width: 50%;
}
#gFooter .contentRight {
    padding-top: 0;
}
.l-footer .l-footer__text {
    padding-block: 36px 16px;
}
#gFooter.l-footer .contentRight .c-home-cv__wrap-item {
    padding: 8px;
    border-radius: 0;
}
#gFooter.l-footer .contentRight .c-home-cv__wrap-item .c-home-cv__wrap-item-title {
    font-size: 14px;
}
#gFooter.l-footer .contentRight .c-home-cv__wrap-item + .c-home-cv__wrap-item {
    margin-top: 16px;
}