@charset "UTF-8";

/* html */
/* Safariバージョン10.1~12.0対策 */
* {
    min-height: 0vw;
    min-height: 0;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    min-inline-size: 0;
    border-width: 0;
    border-style: solid;
}

* {
    margin: 0;
}

:root {
    font-family: Noto Sans JP, system-ui, Avenir, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    font-weight: 400;
    color: var(--body-fg);
    background-color: #fff;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-inline-size: 320px;
    min-block-size: 100svb;
    display: block grid;
    grid-template: "header" "contents" 1fr "footer";
    /*font-size: clamp(0.5625rem, 0.3294198895rem + 0.9944751381vw, 1.125rem);*/

    scroll-behavior: smooth;
}

/* リンク */
:where(:any-link) {
    background-color: unset;
    color: unset;
    text-decoration-line: none;
    text-decoration-thickness: 1px;
    text-underline-offset: 2.5px;
}

ul,
ol {
    padding-inline-start: unset;
    list-style-type: "";
}

summary {
    cursor: pointer;
}

summary::-webkit-details-marker {
    display: none;
}

/* 埋め込み要素 */
img,
picture,
video,
canvas,
svg {
    display: block;
    object-fit: cover;
}

/* ボタン */
button,
[type="button"],
[type="reset"],
[type="submit"],
::file-selector-button {
    padding: unset;
    border: 1px solid transparent;
    border-radius: unset;
    background-color: unset;
    color: unset;
    font: unset;
    letter-spacing: unset;
    text-align: unset;
    text-transform: unset;
    vertical-align: middle;
    appearance: none;
    -webkit-appearance: none;
    touch-action: manipulation;
}

button,
[type="button"],
[type="reset"],
[type="submit"],
[role="button"],
::file-selector-button {
    cursor: pointer;
}

:disabled,
[aria-disabled="true"] {
    cursor: default;
}

/* ダイアログ */
dialog {
    width: unset;
    max-width: unset;
    height: unset;
    max-height: unset;
    padding: unset;
    color: unset;
    background-color: unset;
    border: unset;
    overflow: unset;
}

/* モーダル時の背面スクロール抑制 */
:root:has(:modal) {
    overflow: hidden;
    scrollbar-gutter: stable;
}

:focus:not(:focus-visible) {
    outline: none;
}

/* スクロール時にヘッダーの高さを考慮 */
:focus,
[id]:target {
    scroll-margin-block-start: calc(var(--header-block-size) + 1rem);
}

:root {
    --sp-layout-width: 393;
    --pc-layout-width: 1920;
    --main-color: #0086d1;
    --recruit-color: #4ac9e3;
    --body-fg: #333;
    --body-fg-light: #666;
    --main-bg: #ddf3ff;
    --accent-bg: #fff0ea;
    --service-bg: #ace0f9;
    --footer-accent-color: #fff;
    --recruit-accent-color: #56c1fd;
    --body-bg-gradient: linear-gradient(90deg, var(--accent-bg), var(--main-bg));
    --title_zone-bg-gradient: transparent linear-gradient(106deg, #fff1eb 17%, #ace0f9 100%) 0% 0% no-repeat padding-box;
    --service-bg-gradient: linear-gradient(112deg,
            var(--accent-bg) 20%,
            var(--service-bg) 92%);
    --horiz-bg-gradient: linear-gradient(90deg, var(--accent-bg), var(--main-bg));
    --vert-bg-gradient: linear-gradient(180deg,
            var(--accent-bg),
            var(--service-bg));
    --border-radius-sm: 10px;
    --border-radius-md: 20px;
    --half-leading: calc((1em - 1lh) / 2);
    /* 使用箇所は削除していってください、すみません
  // TODO これやっぱやめる
  --spacing-xs: .75rem; // 12px
  --spacing-sm: 1.25rem; // 20px
  */
    --yu-font-family: "游ゴシック", Yu Gothic, "ヒラギノ角ゴ ProN W3",
        "Hiragino Kaku Gothic ProN";
}

@media (768px < width) {
    :root {
        /* 使わない
    --spacing-xs: 1.25rem; // 20px
    --spacing-sm: 2rem; // 32px
    --spacing-md: 2.5rem; // 40px
    --spacing-lg: 4rem; // 64px
    --spacing-xl: 5rem; // 80px
    --spacing-2xl: 6rem; // 96px
    --spacing-3xl: 8rem; // 128px
    */
    }
}

:root {
    --gt-outer: 20;
    --gt-inner: 25;
}

:root body {
    --gutter-outer: 5vw;
    /* 初期値（JSで上書き） */
    --gutter-inner: 3vw;
    /*
    --gutter-outer: calc(var(--gt-outer) / var(--sp-layout-width) * 100cqi);
    --gutter-inner: calc(var(--gt-inner) / var(--sp-layout-width) * 100cqi);
    */
}

@media (768px < width) {
    :root {
        --gt-outer: 40;
        --gt-inner: 160;
    }

    :root body {
        --gutter-outer: 5vw;
        /* 初期値（JSで上書き） */
        --gutter-inner: 3vw;
        /*
      --gutter-outer: calc(var(--gt-outer) / var(--pc-layout-width) * 100cqi);
      --gutter-inner: calc(var(--gt-inner) / var(--pc-layout-width) * 100cqi);
      */
    }
}

main.contents {
    grid-area: contents;
}

.container {
    display: block grid;
    justify-items: center;
    overflow-x: clip;
    overflow-y: unset;
}

:where(.container > *) {
    inline-size: calc(100% - var(--gutter-outer) * 2);
    max-inline-size: 100%;
}

@media (768px < width) {
    :where(.container > *) {
        inline-size: clamp(48rem, 16.875rem + 64.84375vw, 68.75rem);
        max-inline-size: min(1100px, 100%);
    }
}

.outermost_container {
    justify-items: center;
    overflow-x: hidden;
    overflow-y: auto;
}

:where(.outermost_container > *) {
    inline-size: 100%;
    max-inline-size: 100%;
}

@media (768px < width) {
    :where(.outermost_container > *) {
        inline-size: clamp(48rem, -60rem + 225vw, 120rem);
        max-inline-size: min(1920px, 100%);
    }
}

/* 見出し */
hgroup.hdg1 {
    display: block grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    color: var(--main-color);
    column-gap: 6px;
    grid-template-areas: "before ja" "en     en";
}

@media (768px < width) {
    hgroup.hdg1 {
        column-gap: 21px;
        grid-template-areas: "before en" "...... ja";
    }
}

hgroup.hdg1 h1,
hgroup.hdg1 h2,
hgroup.hdg1 h3 {
    grid-area: ja;
    color: var(--body-fg);
    font-size: clamp(0.5625rem, 0.2776243094rem + 1.2154696133vw, 1.25rem);
    font-weight: bold;
}

hgroup.hdg1 p[lang="en"] {
    grid-area: en;
    font-size: clamp(1.8125rem, 1.0096685083rem + 3.4254143646vw, 3.75rem);
    font-weight: bold;
    text-transform: uppercase;
}

hgroup.hdg1::before {
    grid-area: before;
    content: "";
    background-color: currentColor;
    width: 20px;
    height: 1px;
}

@media (768px < width) {
    hgroup.hdg1::before {
        width: 40px;
        height: 2px;
    }
}

:root {
    --header-block-size: 48px;
}

@media (768px < width) {
    :root {
        --header-block-size: 120px;
    }
}

header.header {
    --_logo-block-size: 26px;
    --_header-nav-display: none;
    --_drawer-btn-display: block;
    grid-area: header;
    max-inline-size: 100%;
    width: 100%;
    block-size: var(--header-block-size);
    padding-block: clamp(0.75rem, 0.5428176796rem + 0.8839779006vw, 1.25rem);
    padding-inline: clamp(1.25rem, 0.9392265193rem + 1.3259668508vw, 2rem);
    display: block grid;
    align-items: center;
    position: sticky;
    inset-block-start: 0;
    background-color: #fff;
    z-index: 10000;
    margin: 0 auto;
}

@media (768px < width) {
    header.header {
        --_logo-block-size: 60px;
        --_header-nav-display: block grid;
        --_drawer-btn-display: none;
        --_header-nav-font-size: clamp(0.875rem, 0.5rem + 0.78125vw, 1.125rem);
        --_header-btn-block-size: 50px;
        --_header-btn-font-size: clamp(1rem,
                0.8571428571rem + 0.2976190476vw,
                1.125rem);
    }
}

.header-inner {
    display: block grid;
    grid-template-columns: max-content 1fr min-content;
    align-items: center;
    column-gap: clamp(3rem, 1.875rem + 2.34375vw, 3.75rem);
    justify-self: center;
    width: 100%;
    max-width: min(1920px, 100%);
}

@media (768px < width) {
    .header-inner {
        zoom: 0.75;
    }
}

@media (1024px < width) {
    .header-inner {
        zoom: 0.8;
    }
}

@media (1280px < width) {
    .header-inner {
        zoom: 0.8;
    }
}

@media (1440px < width) {
    .header-inner {
        zoom: 0.9;
    }
}

@media (1640px < width) {
    .header-inner {
        zoom: initial;
    }
}

@media (1920px <=width) {
    .header-inner {
        min-width: min(1920px, 100%);
    }
}

.header-inner .logo {
    height: var(--_logo-block-size);
    aspect-ratio: 304/59;
}

.header-inner .logo a img {
    block-size: 100%;
    inline-size: auto;
    object-fit: contain;
    object-position: center;
}

.header-nav {
    grid-column: span 2;
    display: var(--_header-nav-display);
    grid-template-columns: subgrid;
    align-items: center;
    column-gap: clamp(1.25rem, -0.625rem + 3.90625vw, 2.5rem);
}

.header-nav__list {
    display: block flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    column-gap: clamp(0.5625rem, 0rem + 1.171875vw, 0.9375rem);
}

.header-nav__list>li {
    display: inline flex;
    align-items: center;
}

a.header-nav__link {
    font-size: var(--_header-nav-font-size);
    font-weight: bold;
    padding-block: clamp(0.5rem, 0.3125rem + 0.390625vw, 0.78125rem);
    padding-inline: clamp(0.125rem, -0.2916666667rem + 0.8680555556vw, 0.75rem);
    border-radius: var(--border-radius-sm);
}

@media (any-hover: hover) {
    a.header-nav__link:hover {
        background-color: rgb(from var(--main-color) r g b/20%);
    }
}

.header-nav__btn-wrapper {
    display: block flex;
    flex-direction: column;
    row-gap: 12px;
    column-gap: clamp(0.75rem, 0rem + 1.5625vw, 1.25rem);
}

@media (1024px < width) {
    .header-nav__btn-wrapper {
        flex-direction: row;
    }
}

a.header-nav__btn {
    max-block-size: var(--_header-btn-block-size);
    font-size: var(--_header-btn-font-size);
    white-space: nowrap;
    align-content: center;
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: var(--_btn-pad-y) var(--_btn-pad-x-ed) var(--_btn-pad-y) var(--_btn-pad-x-st);
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
}

a.header-nav__btn.contact {
    max-width: 210px;
    --_btn-pad-x-st: clamp(0.90625rem, 0.65625rem + 0.5208333333vw, 1.125rem);
    --_btn-pad-x-ed: clamp(1.09375rem,
            1.0580357143rem + 0.0744047619vw,
            1.125rem);
    --_btn-pad-y: clamp(0.546875rem,
            0.2790178571rem + 0.5580357143vw,
            0.78125rem);
    --_prepend-spacing: clamp(0.390625rem,
            0.2120535714rem + 0.3720238095vw,
            0.546875rem);
    --_prepend-w: clamp(1.421875rem,
            0.7254464286rem + 1.4508928571vw,
            2.03125rem);
    --_prepend-h: clamp(0.953125rem,
            0.4888392857rem + 0.9672619048vw,
            1.359375rem);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

a.header-nav__btn.contact:disabled,
a.header-nav__btn.contact[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    a.header-nav__btn.contact:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

a.header-nav__btn.contact {
    grid-template: "before text after" / auto 1fr auto;
}

a.header-nav__btn.contact::before {
    grid-area: before;
    content: "";
    display: block flow;
    inline-size: var(--_prepend-w);
    block-size: var(--_prepend-h);
    margin-inline-end: var(--_prepend-spacing);
    background: url("/auc@2x.png") no-repeat center/contain;
}

a.header-nav__btn.recruit {
    max-width: 200px;
    --_btn-pad-x-st: clamp(1.0625rem,
            0.5267857143rem + 1.1160714286vw,
            1.53125rem);
    --_btn-pad-x-ed: clamp(1.375rem, 1.0892857143rem + 0.5952380952vw, 1.625rem);
    --_btn-pad-y: clamp(0.4921875rem,
            0.2511160714rem + 0.5022321429vw,
            0.703125rem);
    --_prepend-spacing: clamp(0.375rem,
            0.0892857143rem + 0.5952380952vw,
            0.625rem);
    --_prepend-w: clamp(1.203125rem,
            0.6138392857rem + 1.2276785714vw,
            1.71875rem);
    --_prepend-h: var(--_prepend-w);
    background: var(--recruit-color);
    color: #fff;
    transition: background-color 0.3s;
}

a.header-nav__btn.recruit:disabled,
a.header-nav__btn.recruit[aria-disabled="true"] {
    background-color: oklch(from var(--recruit-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    a.header-nav__btn.recruit:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--recruit-color) 70%, #fff);
    }
}

a.header-nav__btn.recruit {
    grid-template: "before text after" / auto 1fr auto;
}

a.header-nav__btn.recruit::before {
    grid-area: before;
    content: "";
    display: block flow;
    inline-size: var(--_prepend-w);
    block-size: var(--_prepend-h);
    margin-inline-end: var(--_prepend-spacing);
    background: url("/atx@2x.png") no-repeat center/contain;
}

.drawer-btn__box {
    display: var(--_drawer-btn-display);
    grid-column: span 1/-1;
}

button#drawer-btn.drawer-btn {
    --_distance: 5px;
    --_thicknes: 3px;
    display: block grid;
    grid-template: var(--_thicknes) / 24px;
    place-content: center;
    block-size: var(--header-block-size);
    aspect-ratio: 1;
    border: unset;
}

button#drawer-btn.drawer-btn .icon {
    display: block grid;
    grid-template-areas: "stack";
    align-self: stretch;
    background-color: var(--main-color);
    --_translate-y-abs: calc(var(--_distance) + var(--_thicknes));
}

button#drawer-btn.drawer-btn .icon::before,
button#drawer-btn.drawer-btn .icon::after {
    content: "";
    grid-area: stack;
    background-color: inherit;
}

button#drawer-btn.drawer-btn .icon::before {
    translate: 0 calc(var(--_translate-y-abs) * -1);
}

button#drawer-btn.drawer-btn .icon::after {
    translate: 0 var(--_translate-y-abs);
}

dialog#drawer {
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}

dialog#drawer[data-active="true"] {
    animation-name: drawer-container-appeared;
}

dialog#drawer[data-active="false"] {
    animation-name: drawer-container-leaved;
}

dialog#drawer::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(0.25rem);
}

dialog#drawer .drawer-menu {
    background-color: #f5f7f8;
    block-size: 100%;
    inline-size: 80%;
    max-inline-size: 440px;
    min-inline-size: 280px;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
}

dialog#drawer .drawer-menu__container {
    margin-block-start: var(--header-block-size);
    margin-inline: var(--gutter-outer);
    max-inline-size: calc(100% - var(--gutter-outer) * 2);
}

dialog#drawer .drawer-menu__btn-wrapper {
    margin-block-end: 40px;
    font-size: clamp(0.875rem, 0.7714088398rem + 0.4419889503vw, 1.125rem);
    display: block grid;
    grid-auto-flow: column;
    gap: 1em;
}

@media (425px >=width) {
    dialog#drawer .drawer-menu__btn-wrapper {
        grid-auto-flow: row;
        grid-auto-rows: 1fr;
    }
}

dialog#drawer .drawer-menu__btn {
    --_btn-pad-x-st: clamp(0.90625rem,
            0.5335162214rem + 1.5903307888vw,
            1.296875rem);
    --_btn-pad-x-ed: clamp(1.09375rem,
            0.6464694656rem + 1.9083969466vw,
            1.5625rem);
    --_btn-pad-y: clamp(0.546875rem,
            0.3232347328rem + 0.9541984733vw,
            0.78125rem);
    white-space: nowrap;
    align-content: center;
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: var(--_btn-pad-y) var(--_btn-pad-x-ed) var(--_btn-pad-y) var(--_btn-pad-x-st);
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
}

dialog#drawer .drawer-menu__btn.recruit {
    --_prepend-spacing: clamp(0.5625rem,
            0.3239503817rem + 1.0178117048vw,
            0.8125rem);
    --_prepend-w: clamp(1.203125rem,
            0.7111164122rem + 2.0992366412vw,
            1.71875rem);
    --_prepend-h: var(--_prepend-w);
    background: var(--recruit-color);
    color: #fff;
    transition: background-color 0.3s;
}

dialog#drawer .drawer-menu__btn.recruit:disabled,
dialog#drawer .drawer-menu__btn.recruit[aria-disabled="true"] {
    background-color: oklch(from var(--recruit-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    dialog#drawer .drawer-menu__btn.recruit:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--recruit-color) 70%, #fff);
    }
}

dialog#drawer .drawer-menu__btn.recruit {
    grid-template: "before text after" / auto 1fr auto;
}

dialog#drawer .drawer-menu__btn.recruit::before {
    grid-area: before;
    content: "";
    display: block flow;
    inline-size: var(--_prepend-w);
    block-size: var(--_prepend-h);
    margin-inline-end: var(--_prepend-spacing);
    background: url("/atx@2x.png") no-repeat center/contain;
}

dialog#drawer .drawer-menu__btn.contact {
    --_prepend-spacing: clamp(0.390625rem,
            0.2415314885rem + 0.6361323155vw,
            0.546875rem);
    --_prepend-w: clamp(1.421875rem,
            0.8404103053rem + 2.4809160305vw,
            2.03125rem);
    --_prepend-h: clamp(0.953125rem,
            0.5654818702rem + 1.6539440204vw,
            1.359375rem);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

dialog#drawer .drawer-menu__btn.contact:disabled,
dialog#drawer .drawer-menu__btn.contact[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    dialog#drawer .drawer-menu__btn.contact:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

dialog#drawer .drawer-menu__btn.contact {
    grid-template: "before text after" / auto 1fr auto;
}

dialog#drawer .drawer-menu__btn.contact::before {
    grid-area: before;
    content: "";
    display: block flow;
    inline-size: var(--_prepend-w);
    block-size: var(--_prepend-h);
    margin-inline-end: var(--_prepend-spacing);
    background: url("/auc@2x.png") no-repeat center/contain;
}

dialog#drawer .drawer-menu__list {
    margin-inline: calc(-1 * var(--gutter-outer));
    background-color: #fff;
    display: block flex;
    flex-direction: column;
}

dialog#drawer .drawer-menu__list-item {
    display: block flex;
    border-block-start: thin solid rgb(from #707070 r g b/20%);
    position: relative;
}

dialog#drawer .drawer-menu__list-item>a {
    font-size: clamp(0.875rem, 0.7714088398rem + 0.4419889503vw, 1.125rem);
    padding-block: 1em;
    padding-inline: var(--gutter-outer);
    inline-size: 100%;
}

@keyframes drawer-container-appeared {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

@keyframes drawer-container-leaved {
    0% {
        transform: translateX(0);
    }

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

footer.footer {
    --_footer-btn-block-size: 70px;
    --_footer-btn-font-size: clamp(1.09375rem,
            0.78125rem + 0.6510416667vw,
            1.5625rem);
    --footer-bg-color-sp: #f5f7f8;
    grid-area: footer;
    max-inline-size: 100cqi;
    background-color: var(--main-color);
    color: var(--footer-accent-color);
    display: block grid;
}

@media (768px < width) {
    footer.footer {
        justify-items: center;
    }
}

.footer-inner {
    width: 100%;
    max-width: min(1920px, 100cqi);
}

@media (768px >=width) {
    .footer-inner.footer_pc {
        display: none;
    }
}

.footer-inner.footer_sp {
    color: var(--main-color);
    background-color: var(--footer-bg-color-sp);
}

@media (768px < width) {
    .footer-inner.footer_sp {
        display: none;
    }
}

.footer_pc {
    padding-block-start: 76px;
    inline-size: clamp(38rem, -8.125rem + 96.09375vw, 68.75rem);
    max-inline-size: min(1100px, 100cqi);
    display: block grid;
}

@media (768px < width <=1520px) {
    .footer_pc {
        grid-template-columns: 5fr 4fr;
        column-gap: clamp(4rem, 1.9574468085rem + 4.2553191489vw, 6rem);
        row-gap: clamp(2.5rem, 0.9680851064rem + 3.1914893617vw, 4rem);
    }

    .footer_pc .footer-logo-col {
        grid-row: 1;
        grid-column: 1 / span 1;
    }

    .footer_pc .footer-nav-col-group {
        display: contents;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:nth-child(2n-1) {
        grid-column: 2 / span 1;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:nth-child(2n) {
        grid-column: 1 / span 1;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:nth-child(1) {
        grid-row: 1 / span 2;
        align-self: center;
    }

    .footer_pc .footer-btn-col {
        grid-row: 2 / span 1;
        grid-column: 1 / span 1;
    }
}

@media (1520px < width) {
    .footer_pc {
        inline-size: calc(100% - var(--gutter-outer) * 2);
        max-inline-size: min(1630px, 100cqi);
        grid-template-columns: 25fr 91fr 34fr;
        column-gap: clamp(2.5rem, -3.2rem + 6vw, 4rem);
    }

    .footer_pc .footer-nav-col-group {
        margin-inline-end: clamp(1.4375rem, -0.9375rem + 2.5vw, 2.0625rem);
        display: grid;
        grid-auto-flow: column;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col {
        padding-inline: clamp(2.40625rem, -1.5125rem + 4.125vw, 3.4375rem);
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:first-child {
        padding-inline-start: 0;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:last-child {
        padding-inline-end: 0;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:not(:last-child) {
        position: relative;
    }

    .footer_pc .footer-nav-col-group .footer-nav-col:not(:last-child)::before {
        content: "";
        display: block flow;
        block-size: 100%;
        position: absolute;
        top: 0;
        right: 0;
        border-inline-end: 2px solid var(--footer-accent-color);
    }
}

.footer-nav__item {
    font-size: clamp(0.6875rem, 0.5062154696rem + 0.773480663vw, 1.125rem);
    font-weight: bold;
}

.footer-nav__item:not(:last-child) {
    margin-block-end: 26px;
}

li.footer-nav__nest-item {
    font-size: 14px;
}

li.footer-nav__nest-item:not(:last-child) {
    margin-block-end: 18px;
}

.footer__logo {
    margin-block-end: 39px;
    display: block flow;
    max-inline-size: 250px;
}

.footer__logo>img {
    inline-size: 100%;
}

.footer__address {
    padding-inline-start: 4px;
    font-size: clamp(0.84375rem, 0.6145833333rem + 0.4774305556vw, 1.1875rem);
    line-height: 1.5263157895;
}

.footer__address-label {
    margin-block-start: var(--half-leading);
    margin-block-end: 0.8947368421em;
    font-weight: bold;
}

.footer__address-body {
    margin-block-start: calc(var(--half-leading) * 2);
    font-style: normal;
}

a.footer-nav__btn {
    max-block-size: var(--_footer-btn-block-size);
    font-size: var(--_footer-btn-font-size);
    word-break: keep-all;
    overflow-wrap: anywhere;
    align-content: center;
    margin-block-end: clamp(2.40625rem, 1.71875rem + 1.4322916667vw, 3.4375rem);
    display: block grid;
    grid-template: "before text after" / auto 1fr auto;
    align-items: center;
    padding: var(--_btn-pad-y) var(--_btn-pad-x-ed) var(--_btn-pad-y) var(--_btn-pad-x-st);
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
}

a.footer-nav__btn.contact {
    max-width: 340px;
    --_btn-pad-x-st: clamp(1.3125rem, 0.9375rem + 0.78125vw, 1.875rem);
    --_btn-pad-x-ed: clamp(0.625rem, 0.4583333333rem + 0.3472222222vw, 0.875rem);
    --_btn-pad-y: clamp(0.875rem, 0.625rem + 0.5208333333vw, 1.25rem);
    --_append-spacing: clamp(0.6875rem, 0.4791666667rem + 0.4340277778vw, 1rem);
    --_arrow-size: clamp(0.875rem, 0.625rem + 0.5208333333vw, 1.25rem);
    --_circle-size: clamp(1.3125rem, 0.9375rem + 0.78125vw, 1.875rem);
    background: var(--footer-accent-color);
    color: var(--main-color);
    transition: background-color 0.3s;
}

a.footer-nav__btn.contact:disabled,
a.footer-nav__btn.contact[aria-disabled="true"] {
    background-color: oklch(from var(--footer-accent-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    a.footer-nav__btn.contact:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb,
                var(--footer-accent-color) 70%,
                var(--main-color));
    }
}

a.footer-nav__btn.contact {
    text-align: revert;
}

a.footer-nav__btn.contact::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: var(--_circle-size);
    block-size: var(--_circle-size);
    margin-inline-start: var(--_append-spacing);
    border-radius: calc(infinity * 1px);
    background: var(--main-color) url("/image/arrow_right_white.png") no-repeat center/var(--_arrow-size);
}

.footer__banner {
    max-inline-size: 340px;
}

.footer__banner>img {
    inline-size: 100%;
}

.footer_sp {
    padding-block-start: 38px;
}

.footer_sp .footer-nav-col {
    padding-inline: calc(var(--gutter-outer) + var(--gutter-inner));
}

.footer_sp .footer-nav__item {
    margin-block-end: 21px;
}

.copylight {
    padding-block-start: clamp(1.5rem,
            0.8780339806rem + 2.6537216828vw,
            4.0625rem);
    margin-block-end: 22px;
}

.copylight small {
    font-size: 14px;
}

@media (768px < width) {
    .copylight {
        text-align: center;
    }
}

@media (768px >=width) {
    .copylight {
        padding-inline: calc(var(--gutter-outer) + var(--gutter-inner));
    }
}

/*****************
* タイトル部
******************/
.title_zone {
    --tz-height: clamp(12.5rem, 8.6153314917rem + 16.5745856354vw, 21.875rem);
    height: var(--tz-height);
    margin-bottom: clamp(2.5rem, 1.4640883978rem + 4.4198895028vw, 5rem);
    background: var(--title_zone-bg-gradient);
}

.title_zone__title hgroup {
    display: block grid;
    grid-template-columns: 1fr;
    gap: 0;
    grid-template-areas: "ja" "en";
    align-items: center;
    color: var(--main-color);
}

.title_zone__title hgroup h1,
.title_zone__title hgroup h2,
.title_zone__title hgroup h3 {
    grid-area: ja;
    font-size: clamp(
            /* 最小フォントサイズ */
            1.5rem,
            /* 流動的フォントサイズ */
            2.3007596685rem + 2.9834254144vw,
            /* 上限：コンテナ高さ ÷ 2 行 */
            calc(var(--tz-height) / 2));
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1.1;
    word-break: break-all;
    overflow-wrap: anywhere;
}

@media (768px < width) {

    .title_zone__title hgroup h1,
    .title_zone__title hgroup h2,
    .title_zone__title hgroup h3 {
        /*text-wrap: nowrap;*/
    }
}

.title_zone__title hgroup p[lang="en"] {
    grid-area: en;
    color: var(--body-fg);
    font-size: clamp(1rem, 0.6374309392rem + 1.546961326vw, 1.875rem);
    font-weight: bold;
}

.title_zone__title hgroup p[lang="en"]::before {
    content: "■";
    color: #ff8f1c;
    width: clamp(1rem, 0.6374309392rem + 1.546961326vw, 1.875rem);
    height: clamp(1rem, 0.6374309392rem + 1.546961326vw, 1.875rem);
    padding-right: calc(clamp(1rem, 0.6374309392rem + 1.546961326vw, 1.875rem) * 0.25);
    padding-left: calc(clamp(1rem, 0.6374309392rem + 1.546961326vw, 1.875rem) * 0.25);
}

nav:has(ol#breadcrumb) {
    padding-top: 1rem;
}

ol.breadcrumb {
    display: flex;
    gap: clamp(0.25rem, 0.1464088398rem + 0.4419889503vw, 0.5rem);
}

ol.breadcrumb li.breadcrumb-item {
    display: flex;
    align-items: center;
    gap: clamp(0.25rem, 0.1464088398rem + 0.4419889503vw, 0.5rem);
    font-size: clamp(0.75rem, 0.6464088398rem + 0.4419889503vw, 1rem);
}

ol.breadcrumb li.breadcrumb-item:not(:last-child)::after {
    content: "ー";
    font-size: clamp(0.75rem, 0.6464088398rem + 0.4419889503vw, 1rem);
    color: hsl(0, 0%, 50%);
}

ol.breadcrumb li.breadcrumb-item a:hover {
    opacity: 0.5;
}

/* --------------------------
フォーム用CSS
---------------------------*/

/* モーダルで画像の拡大表示*/
.menu-modal {
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    transform: translate(-50%, -50%);
    display: none;
    overflow-y: auto;
    /* 必要に応じてスクロール可 */
}

.menu-bigimg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: 60%;
    margin: auto;
    display: block;
}

@media (768px > width) {
    .menu-bigimg {
        max-width: 90%;
    }
}

.menu-img:hover {
    opacity: 0.7;
}

.aform {
    display: flex;
    justify-content: center;
    margin-bottom: 100px;
}

.aform-content {
    max-width: 800px;
    width: 100%;
    padding: 50px;
    background-color: #f5f5f6;
    border-radius: 10px;
}

.aform-label {
    margin-left: 10px;
}

dt:has(.aform-label:empty) {
    height: 0 !important;
}

dt:has(.aform-label) {
    display: block;
    margin-bottom: 10px;
}

[class*="parts-h1"] {
    display: flex;
    align-items: flex-end;
    margin: 0;
    margin-bottom: 20px;
    font-size: 130% !important;
    font-weight: bold;
    color: var(--main-color);
    border-bottom: none !important;
}

[class*="parts-h1"]::before {
    display: inline-block;
    content: "";
    margin: 20px clamp(0.5rem, 0.2669198895rem + 0.9944751381vw, 1.0625rem) 0 calc(-1 * clamp(1.0625rem, 0.7776243094rem + 1.2154696133vw, 1.75rem));
    width: 10px;
    height: 30px;
    background-color: var(--main-color);
}

[class*="parts-h2"] {
    margin: 0;
    margin-bottom: 40px;
    font-size: 120% !important;
    font-weight: bold;
    border-bottom: none !important;
}

[class*="parts-h3"] {
    margin: 0;
    margin-bottom: 20px;
    padding: 10px !important;
    font-size: 110% !important;
    font-weight: bold;
    border-bottom: 4px solid var(--main-color) !important;
    background-color: #eff9ff;
}

[class*="dl_setsubi"] {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

[class*="_other"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.aform-required {
    line-height: 1.5 !important;
}

.aform-note {
    color: #e06100 !important;
}

#aform-confirm-form .aform-note {
    display: none;
}

#aform-confirm-form [class*="dl_kibouymd"] {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#aform-confirm-form [class*="dl_jikan"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.aform-confirm {
    display: inline-block;
    color: #e06100 !important;
    font-weight: bold;
    margin-left: 10px;
}

.aform-outer {
    display: flex;
    justify-content: center;
}

.aform-outer.confirm #aform-result {
    display: none;
}

.aform-kana-ul {
    padding-left: 10px !important;
}

li input.aform-kana {
    width: 60% !important;
}

@media (768px > width) {
    .aform-content {
        padding: 10px;
    }

    [class*="parts-h1"] {
        margin-left: 30px !important;
    }

    [class*="parts-h1"]::before {
        display: inline-block;
        content: "";
        margin: 20px clamp(0.5rem, 0.2669198895rem + 0.9944751381vw, 1.0625rem) 0 calc(-2 * 10px) !important;
        width: 10px;
        height: 30px;
        background-color: var(--main-color);
    }

    [class*="parts-h3"] {
        margin-left: 4px !important;
        margin-right: 10px !important;
    }
}

.aform-input-example {
    margin-left: 10px;
}

.aform-note {
    margin-left: 10px !important;
}

.validation-advice {
    margin-left: 10px !important;
}

dd:has(.aform-calendar) {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-left: 10px !important;
    max-width: 375px !important;
}

/* テキスト入力 */
input[type="text"] {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    height: 56px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 10px;
    width: unset !important;
    max-width: calc(100% - 16px);
    flex: 1 1 0%;
}

textarea {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    padding: 16px !important;
    margin-left: 10px;
    width: 100%;
    max-width: calc(100% - 16px);
    flex: 1 1 0%;
}

/* テキスト入力 */
input[type="email"] {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    height: 56px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 10px;
    width: unset !important;
    max-width: calc(100% - 16px);
    flex: 1 1 0%;
}

/* 数値入力 */
input[type="number"] {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    height: 56px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 10px;
    margin-right: 10px;
    max-width: calc(100% - 16px);
    width: unset !important;
    flex: 1 1 0%;
}

.keiyo-tel {
    padding-right: 16px !important;
    padding-left: 16px !important;
    max-width: calc(100% / 3 - 32px) !important;
}

/* 日付入力 */
input[type="date"] {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    height: 56px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 10px;
    margin-right: 10px;
    max-width: calc(100% - 16px);
    width: unset !important;
    flex: 1 1 0%;
}

/* ラジオボタン */
li:has(input[type="radio"]) {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    padding: 16px 16px 16px 16px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 12px;
    height: auto;
}

li:has(input[type="radio"]) label {
    display: inline-block;
    width: 90%;
}

/* チェックボックス */
li:has(input[type="checkbox"]) {
    /*:display: flex;*/
    -webkit-box-align: center;
    align-items: center;
    padding: 16px 16px 16px 16px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: normal;
    transition: font-size;
    cursor: pointer;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 12px;
    height: auto;
    gap: 8px;
}

li:has(input[type="checkbox"]) label {
    display: inline-block;
    width: 90%;
}

select {
    appearance: none;
    /* ブラウザのデフォルトUIを非表示 */
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px 40px 10px 15px !important;
    height: 56px;
    font-size: 16px;
    color: #333;
    cursor: pointer;
    background-image: url("/image/down@2x.png");
    /* 矢印画像 */
    background-repeat: no-repeat;
    background-position: right 15px center;
    /* 右寄せ */
    background-size: 21px 14px;
    /* 矢印画像のサイズ */
    margin-left: 10px;
    max-width: calc(100% - 16px);
}

select:focus {
    outline: none;
    border-color: #007bff;
    /* フォーカス時の色 */
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}

.clear_upload {
    /* input要素のうちtype属性値がbuttonのものに対して装飾 */
    background-color: #fff;
    border: 1px solid var(--main-color);
    /* 枠線 */
    border-radius: 0.3em;
    /* 角丸 */
    min-width: 100px;
    min-height: 30px;
    margin-left: 10px;
    margin-top: 10px;
    text-align: center;
}

[class*="dl_photo"] dd .aform-input-example {
    margin-left: 0 !important;
}

input[type="file"] {
    width: calc(90% - 100px);
    max-width: 400px;
}

input[type="file"]::file-selector-button {
    -webkit-appearance: none;
    background-color: var(--main-color);
    border-radius: 0.3em;
    color: #fff;
    min-width: 100px;
    min-height: 30px;
    margin-top: 10px;
    text-align: center;
}

[class*="dl_photo"] dd {
    margin-left: 10px !important;
}

input[type="button"]#aform_btn_back {
    background-color: #fff;
    border: 1px solid var(--main-color);
    /* 枠線 */
    border-radius: 0.3em;
    /* 角丸 */
    min-width: 170px;
    min-height: 70px;
    margin-left: 10px;
    text-align: center;
}

input[type="submit"] {
    /* input要素のうちtype属性値がbuttonのものに対して装飾 */
    background-color: var(--main-color);
    border-radius: 0.3em;
    /* 角丸 */
    color: #fff;
    font-weight: bold;
    min-width: 340px;
    min-height: 70px;
    text-align: center;
}

@media (516px > width) {
    .aform-button-area {
        display: flex;
        flex-direction: column-reverse;
        gap: 20px;
        background-color: #f5f5f6 !important;
        padding: 0 !important;
    }

    input[type="submit"] {
        margin: 0 !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #aform_result {
        display: flex;
        flex-direction: column;
    }
}

input[type="submit"]:hover {
    opacity: 0.5;
}

.aform-button-area {
    background-color: #f5f5f6 !important;
}

.ky-aform-error {
    margin-top: 100px;
}

.ky-aform-error .aform-error-list dt {
    padding-left: 0 !important;
}

#aform_result {
    background-color: none !important;
}

.aform-outer {
    margin-bottom: 200px;
}

.aform-input-example img {
    max-width: 50%;
}


/* ベース：3列レイアウト */
.aform-checkbox-ul.kensetsu_shurui {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    list-style: none;
    padding: 0;
    margin: 0;
}

/* li内のテキストとチェックボックスを整列したい場合 */
.aform-checkbox-ul.kensetsu_shurui li {
    display: flex;
    align-items: center;
}

/* スマホなど画面幅768px以下なら2列に */
@media (max-width: 768px) {
    .aform-checkbox-ul.kensetsu_shurui {
        grid-template-columns: repeat(2, 1fr);
    }
}

.aform-confirm.kensetsu_number::before {
    content: "第";
    color: #333;
    margin-right: 4px;
}

.aform-confirm.kensetsu_number::after {
    content: "号";
    color: #333;
    margin-left: 4px;
}


.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance: textfield;
}

@media (max-width: 768px) {
  #kensetsu_number {
    width: 78% !important;
    max-width: 389px;
  }
}

/* --------------------------
マンションキャンペーン用CSS
---------------------------*/

.campaign .title_zone__title hgroup h1,
.campaign .title_zone__title hgroup h2,
.campaign .title_zone__title hgroup h3 {
    grid-area: ja;
    font-size: clamp(1.875rem, 0.7095994475rem + 4.9723756906vw, 4.6875rem);
    font-weight: bold;
    text-transform: uppercase;
}

@media (768px < width) {

    .campaign .title_zone__title hgroup h1,
    .campaign .title_zone__title hgroup h2,
    .campaign .title_zone__title hgroup h3 {
        text-wrap: nowrap;
    }
}

.campaign h2 {
    font-size: clamp(1.875rem, 1.6160220994rem + 1.1049723757vw, 2.5rem);
    text-align: center;
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
    padding-inline: var(--gutter-outer);
}

.campaign__operation {
    position: relative;
    height: fit-content;
    background: transparent linear-gradient(120deg, #fff1eb 10%, #ace0f9 100%) 0% 0% no-repeat padding-box;
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
}

.campaign__operation-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: clamp(15.625rem, 14.3301104972rem + 5.5248618785vw, 18.75rem);
    gap: clamp(1.25rem, 0.7320441989rem + 2.2099447514vw, 2.5rem);
}

.campaign__operation-box .btn {
    width: 340px;
    margin: 0 auto;
}

.campaign__operation-box .btn a {
    word-break: keep-all;
    overflow-wrap: anywhere;
    align-content: center;
    font-size: clamp(1.375rem, 1.2973066298rem + 0.3314917127vw, 1.5625rem);
    font-weight: bold;
    line-height: 1.5;
    block-size: 70px;
    max-width: 340px;
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

.campaign__operation-box .btn a:disabled,
.campaign__operation-box .btn a[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    .campaign__operation-box .btn a:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

.campaign__operation-box .btn a {
    text-align: revert;
}

.campaign__operation-box .btn a::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: 30px;
    block-size: 30px;
    margin-inline-start: 12.5px;
    border-radius: calc(infinity * 1px);
    background: #fff url("/down@2x.png") no-repeat center/15px;
}

.campaign__contents {
    min-height: clamp(18.75rem, 13.570441989rem + 22.0994475138vw, 31.25rem);
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
}

.campaign__contents-inner {
    min-height: clamp(18.75rem, 13.570441989rem + 22.0994475138vw, 31.25rem);
    background-color: #fff;
    border-radius: 10px;
    padding: clamp(0.625rem, -0.1519337017rem + 3.3149171271vw, 2.5rem);
}

.campaign__form h3 {
    font-size: clamp(1.875rem, 1.6160220994rem + 1.1049723757vw, 2.5rem);
    text-align: center;
    margin-bottom: clamp(1.25rem, 0.7320441989rem + 2.2099447514vw, 2.5rem);
}

.campaign__description {
    padding-top: clamp(1.25rem, 0.7320441989rem + 2.2099447514vw, 2.5rem);
    background: transparent linear-gradient(120deg, #fff1eb 10%, #ace0f9 100%) 0% 0% no-repeat padding-box;
    margin-bottom: 100px;
}

.campaign__description h2 {
    font-size: clamp(1.75rem, 1.4392265193rem + 1.3259668508vw, 2.5rem);
    text-align: center;
    margin-bottom: clamp(1.25rem, 0.7320441989rem + 2.2099447514vw, 2.5rem);
}

.campaign__description_steps {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1100px;
    margin-bottom: 70px;
    gap: clamp(10px, -12.857px + 2.976vw, 30px); /* 768-1440 */
}

@media (768px > width) {
    .campaign__description_steps {
        flex-direction: column;
        justify-content: center;
        gap: 20px;
    }
}

.campaign__description_steps_item-step {
    width: 150px;
    height: 350px;
    background-color: #fff;
    border: 2px solid var(--main-color);
    border-radius: 20px;
}

@media (768px > width) {
    .campaign__description_steps_item-step {
        writing-mode: initial;
        text-orientation: initial;
        width: calc(375px - var(--gutter-outer));
        height: 140px;
    }
}

.campaign__description_steps_item-step .label_customer,
.campaign__description_steps_item-step .label_keiyo {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 17px 17px 0 0;
    width: 100%;
    height: 64px;
    color: #fff;
    font-size: clamp(16px, 9.143px + 0.893vw, 22px); /* 768-1440 */
    font-weight: bold;
    text-align: center;
}

@media (768px > width) {

    .campaign__description_steps_item-step .label_customer,
    .campaign__description_steps_item-step .label_keiyo {
        font-size: clamp(18px, 16.571px + 0.446vw, 20px);
        height: 40px;
    }
}

.campaign__description_steps_item-step .label_customer {
    background-color: #ff8f1c;
    border: 1px solid #ff8f1c;
}

.campaign__description_steps_item-step .contents {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: clamp(16px, 9.143px + 0.893vw, 22px); /* 768-1440 */
    font-weight: bold;
    text-align: center;
    width: 100%;
    height: calc(100% - 64px);
    padding-top: 13px;
    writing-mode: vertical-lr;
}

@media (768px > width) {
    .campaign__description_steps_item-step .contents {
        writing-mode: initial;
        text-orientation: initial;
        justify-content: center;
        padding-top: 0;
        height: calc(100% - 40px);
        font-size: clamp(18px, 16.571px + 0.446vw, 20px);
    }
}

.campaign__description_steps_item-step .num {
    display: inline-block;
    text-combine-upright: all;
    color: var(--main-color);
}

.campaign__description_steps_item-arrow {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 27.5px 0 27.5px 21px;
    /* 高さ(27.5px)と幅(26px) */
    border-color: transparent transparent transparent var(--main-color);
    /* 右が頂点の色 */
}

@media (768px > width) {
    .campaign__description_steps_item-arrow {
        border-width: 26px 27.5px 0 27.5px;
        /* 高さ: 26px、幅: 55px */
        border-color: var(--main-color) transparent transparent transparent;
        /* 下向きの三角形 */
    }
}

.campaign__description-notice {
    background-color: #fff;
    border-radius: 20px;
    padding: clamp(0.625rem, -0.1519337017rem + 3.3149171271vw, 2.5rem);
    margin-bottom: 50px;
}

.campaign__description-notice-inner {
    font-size: clamp(1rem, 0.9482044199rem + 0.2209944751vw, 1.125rem);
    line-height: 1.8;
    margin-bottom: 30px;
}

.campaign__description-notice-inner p {
    margin-bottom: 10px;
}

.campaign__description-notice-inner ul li {
    position: relative;
    padding-left: clamp(1.125rem, 1.0732044199rem + 0.2209944751vw, 1.25rem);
}

.campaign__description-notice-inner ul li::before {
    content: "●";
    color: var(--main-color);
    font-size: clamp(0.75rem, 0.6982044199rem + 0.2209944751vw, 0.875rem);
    left: 0;
    top: calc(clamp(1.125rem, 1.0732044199rem + 0.2209944751vw, 1.25rem) - clamp(0.75rem, 0.6982044199rem + 0.2209944751vw, 0.875rem) - 1px);
    position: absolute;
}

.campaign__description-notice .blue {
    color: var(--main-color);
    font-weight: bold;
}

.campaign__description-notice .divide {
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    width: 100%;
    height: 0;
    margin-bottom: 30px;
}

.campaign .confirm_btn {
    display: block grid;
    grid-template: "before text after" / auto 1fr auto;
    align-items: center;
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    background: var(--main-color);
    color: #fff;
    transition: opacity 0.3s;
}

@media (any-hover: hover) {
    .campaign .confirm_btn:hover {
        opacity: 0.7;
    }
}

.campaign .confirm_btn {
    text-align: revert;
}

.campaign .confirm_btn::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: 30px;
    block-size: 30px;
    margin-inline-start: 22.5px;
    border-radius: calc(infinity * 1px);
    background: #fff url("/anp@2x.png") no-repeat center/20px;
}

/* --------------------------
お問い合わせ用CSS
---------------------------*/

.contact .title_zone__title hgroup h1,
.contact .title_zone__title hgroup h2,
.contact .title_zone__title hgroup h3 {
    grid-area: ja;
    font-size: clamp(1.875rem, 0.7095994475rem + 4.9723756906vw, 4.6875rem);
    font-weight: bold;
    text-transform: uppercase;
}

@media (768px < width) {

    .contact .title_zone__title hgroup h1,
    .contact .title_zone__title hgroup h2,
    .contact .title_zone__title hgroup h3 {
        text-wrap: nowrap;
    }
}

.contact h2 {
    font-size: clamp(1.875rem, 1.6160220994rem + 1.1049723757vw, 2.5rem);
    text-align: center;
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
}

.contact__operation {
    position: relative;
    height: fit-content;
    background: transparent linear-gradient(120deg, #fff1eb 10%, #ace0f9 100%) 0% 0% no-repeat padding-box;
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
}

.contact__operation p {
    padding: 40px 0 0 0;
    text-align: center;
    line-height: 1.8;
}

.contact__operation-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: clamp(9.375rem, 8.275rem + 4.695vw, 12.5rem);
    gap: clamp(1.25rem, 0.7320441989rem + 2.2099447514vw, 2.5rem);
    margin-block: 40px;
}

.contact__operation-box .btn {
    width: clamp(12.5rem, 8.707rem + 16.185vw, 21.25rem);
    /* 200-340 */
    margin: 0 auto;
}

.contact__operation-box .btn a {
    word-break: keep-all;
    overflow-wrap: anywhere;
    align-content: center;
    font-size: clamp(0.813rem, 0.623rem + 0.809vw, 1.25rem);
    /* 13-20 */
    font-weight: bold;
    line-height: 1.5;
    block-size: clamp(2.813rem, 2.135rem + 2.89vw, 4.375rem);
    /* 45-70 */
    max-width: clamp(12.5rem, 8.707rem + 16.185vw, 21.25rem);
    /* 200-340 */
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

.contact__operation-box .btn a:disabled,
.contact__operation-box .btn a[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    .contact__operation-box .btn a:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

.contact__operation-box .btn a {
    text-align: revert;
}

.contact__operation-box .btn a::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: clamp(1.375rem, 1.158rem + 0.925vw, 1.875rem);
    /* 22-30 */
    block-size: clamp(1.375rem, 1.158rem + 0.925vw, 1.875rem);
    /* 22-30 */
    margin-inline-start: 12.5px;
    border-radius: calc(infinity * 1px);
    background: #fff url("/anp@2x.png") no-repeat center/15px;
}

.contact__operation-box .btn.current a {
    background: #cef6fe;
    color: var(--main-color);
}

.contact__operation-box .btn_gaibu_link {
    width: clamp(12.5rem, 8.707rem + 16.185vw, 21.25rem);
    /* 200-340 */
    margin: 0 auto;
}

.contact__operation-box .btn_gaibu_link a {
    /*
    word-break: keep-all;
    overflow-wrap: anywhere;
    align-content: center;
    font-size: clamp(1.375rem, 1.2973066298rem + 0.3314917127vw, 1.5625rem);
    font-weight: bold;
    line-height: 1.5;
    block-size: 70px;
    max-width: 340px;
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
    */
    word-break: keep-all;
    overflow-wrap: anywhere;
    display: inline grid !important;
    align-content: center;
    font-size: clamp(0.813rem, 0.623rem + 0.809vw, 1.25rem);
    /* 13-20 */
    line-height: normal;
    max-width: clamp(12.5rem, 8.707rem + 16.185vw, 21.25rem);
    /* 200-340 */
    width: 100%;
    block-size: clamp(2.813rem, 2.135rem + 2.89vw, 4.375rem);
    /* 45-70 */
    min-block-size: 30px;
    max-block-size: 70px;
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

.contact__operation-box .btn_gaibu_link a:disabled,
.contact__operation-box .btn_gaibu_link a[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    .contact__operation-box .btn_gaibu_link a:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }

    .contact__operation-box .btn_gaibu_link a::after:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

.contact__operation-box .btn_gaibu_link a {
    text-align: revert;
}

.contact__operation-box .btn_gaibu_link a::after {
    /*
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: 30px;
    block-size: 30px;
    margin-inline-start: 12.5px;
    border-radius: calc(infinity * 1px);
    background: var(--main-color) url("/image/target_blank_w.png") no-repeat center/15px;
    */

    grid-area: after;
    content: "";
    display: block flow;
    inline-size: 1.28em;
    block-size: 1em;
    margin-inline-start: 0.75em;
    background: url("/image/target_blank_w.png") no-repeat center/contain;
}

.contact__notice {
    margin-bottom: clamp(3.125rem, 2.3480662983rem + 3.3149171271vw, 5rem);
}

.contact__notice-inner {
    min-height: clamp(18.75rem, 18.75rem + 0vw, 18.75rem);
    background-color: #fff;
    border-radius: 10px;
    padding: clamp(0.625rem, -0.1519337017rem + 3.3149171271vw, 2.5rem);
}

.contact__notice-inner ul li {
    line-height: 1.8;
    font-size: 18px;
}

.contact__description {
    height: fit-content;
    margin-bottom: 100px;
    overflow-y: hidden;
}

.contact__description-hosoku {
    margin-bottom: 40px;
    line-height: 1.5;
    max-width: 980px;
    text-align: center;
}

.contact__description-hosoku h3 {
    margin-bottom: 10px;
    font-size: clamp(1.125rem, 0.9178176796rem + 0.8839779006vw, 1.625rem);
}

.contact__description-hosoku p {
    font-size: clamp(1rem, 0.9482044199rem + 0.2209944751vw, 1.125rem);
}

.contact__description-customer {
    text-align: center;
}

.contact__description-customer a {
    font-size: clamp(1.125rem, 0.8142265193rem + 1.3259668508vw, 1.875rem);
    font-weight: bold;
}

.contact__description-address {
    margin-bottom: 40px;
}

.contact__description-address .contact__list {
    display: block grid;
    --_min-cell-width: 290px;
    grid-template-columns: repeat(auto-fit,
            minmax(min(var(--_min-cell-width), 100%), 380px));
    justify-content: center;
    gap: 25px;
}

.contact__description-address .contact__list-item {
    display: block grid;
    grid-template-rows: subgrid;
    grid-row: span 5;
    justify-items: center;
    row-gap: 0px;
    padding-block: 20px;
    padding-inline: 13px;
    background-color: #fff;
    border: 2px solid var(--main-color);
    border-radius: var(--border-radius-md);
}

.contact__description-address .contact__list-item-icon {
    order: -1;
    object-fit: contain;
    margin-block: 25.5px;
    inline-size: clamp(4.5rem, 3.7246335964rem + 3.1567080045vw, 6.25rem);
    aspect-ratio: 1;
}

.contact__description-address .contact__list-item-title {
    margin-block-end: 17.5px;
    font-weight: bold;
    font-size: clamp(1rem, 0.8892333709rem + 0.4509582864vw, 1.25rem);
    color: var(--main-color);
}

.contact__description-address .contact__list-item-tel {
    margin-block-end: 11px;
    --_ruby-font-size: 6px;
    --_before-img: url("/image/phone_black.png");
    --_before-w: clamp(2.25rem, 2.0838500564rem + 0.6764374295vw, 2.625rem);
    --_before-h: clamp(1.625rem, 1.4865417136rem + 0.5636978579vw, 1.9375rem);
    font-weight: bold;
    font-size: clamp(2.125rem, 1.9588500564rem + 0.6764374295vw, 2.5rem);
    letter-spacing: -1.2px;
    white-space: nowrap;
    display: inline flex;
    align-items: center;
    column-gap: 17.5px;
}

.contact__description-address .contact__list-item-tel.freedial {
    column-gap: 11px;
    --_before-img: url("/image/freedial.png");
    --_before-w: clamp(3.1875rem, 2.9521209132rem + 0.9582863585vw, 3.71875rem);
    --_before-h: clamp(1.875rem, 1.7365417136rem + 0.5636978579vw, 2.1875rem);
}

.contact__description-address .contact__list-item-tel::before {
    content: "";
    display: block;
    inline-size: var(--_before-w);
    block-size: var(--_before-h);
    background: var(--_before-img) no-repeat center/contain;
}

.contact__description-address .contact__list-item-tel ruby {
    ruby-align: center;
}

.contact__description-address .contact__list-item-tel ruby rt {
    font-weight: 500;
    font-size: var(--_ruby-font-size);
}

.contact__description-address .contact__list-item-note {
    margin-block-end: 19px;
    font-size: clamp(0.8125rem, 0.7294250282rem + 0.3382187148vw, 1rem);
}

.contact__description-address .contact__list-item-btn .btn-arrow.contact {
    white-space: nowrap;
    font-size: clamp(1rem, 0.7507750846rem + 1.0146561443vw, 1.5625rem);
    min-block-size: 51px;
    --_btn-pad-x-st: clamp(1.0625rem, 0.7025084555rem + 1.4656144307vw, 1.875rem);
    --_btn-pad-x-ed: clamp(1.0625rem,
            1.1455749718rem + -0.3382187148vw,
            0.875rem);
    --_btn-pad-y: clamp(0.78125rem, 0.5735625705rem + 0.8455467869vw, 1.25rem);
    --_append-spacing: clamp(1.25rem,
            1.1807708568rem + 0.281848929vw,
            1.40625rem);
    --_circle-size: clamp(1.59375rem, 1.4691375423rem + 0.5073280722vw, 1.875rem);
    --_arrow-size: clamp(0.8125rem, 0.6186583991rem + 0.7891770011vw, 1.25rem);
    --_prepend-w: clamp(1.375rem, 0.9042418264rem + 1.916572717vw, 2.4375rem);
    --_prepend-h: clamp(0.9375rem, 0.63289177rem + 1.2401352875vw, 1.625rem);
    --_prepend-spacing: clamp(0.625rem,
            0.6416149944rem + -0.067643743vw,
            0.5875rem);
}

.contact__description-address .contact__list-item-btn .btn-arrow.contact {
    grid-template: "before text after" / auto 1fr auto;
}

.contact__description-address .contact__list-item-btn .btn-arrow.contact::before {
    grid-area: before;
    content: "";
    display: block flow;
    inline-size: var(--_prepend-w);
    block-size: var(--_prepend-h);
    margin-inline-end: var(--_prepend-spacing);
    background: url("/auc@2x.png") no-repeat center/contain;
}

@media (768px < width) {
    .contact__description-address .contact__list {
        --_min-cell-width: 360px;
        gap: 40px;
    }

    .contact__description-address .contact__list-item {
        padding-inline: 20px;
        border: 2px solid var(--main-color);
    }

    .contact__description-address .contact__list-item-title {
        margin-block-end: 20px;
    }

    .contact__description-address .contact__list-item-tel {
        margin-block-end: 13px;
        column-gap: 10px;
        --_ruby-font-size: 8px;
    }

    .contact__description-address .contact__list-item-tel.freedial {
        column-gap: 3px;
    }

    .contact__description-address .contact__list-item-note {
        margin-block-end: 17px;
    }

    .contact__description-address .contact__list-item-btn {
        margin-block-end: 15px;
    }

    .contact__operation-box {
        flex-direction: row;
        margin-block: 10px;
    }
}

@media (1280px < width) {
    .contact__description-address .contact__list {
        margin-inline: -60px;
    }
}

.brsp {
    display: none;
}

@media (768px >=width) {
    .brsp {
        display: inline-block;
    }
}

/*
* 背景CSS
*/
.illust-wrapper {
    --_fluid-ratio: calc(1 / var(--pc-layout-width) * 100vw);
    position: relative;
    z-index: calc(-infinity);
    display: none;
}

@media (768px < width) {
    .illust-wrapper {
        display: block;
    }
}

.bg-illust {
    inline-size: 100vw;
    block-size: 1600px;
    position: fixed;
    top: 0;
    left: 0;
    background: transparent linear-gradient(90deg, #fdfdfd 0%, #eff9ff 100%) 0% 0% no-repeat padding-box;
}

.bg-illust>img {
    inline-size: calc(var(--_width) * var(--_fluid-ratio));
    position: absolute;
    left: calc(var(--_x, 0) * var(--_fluid-ratio));
    top: calc(var(--_y, 0) * var(--_fluid-ratio));
    object-fit: cover;
}

.bg-illust>img:nth-of-type(1) {
    --_width: 729;
    --_x: -95;
    --_y: 0;
}

.bg-illust>img:nth-of-type(2) {
    --_width: 624;
    --_x: 1545;
    --_y: 442;
}

.bg-illust>img:nth-of-type(3) {
    --_width: 412;
    --_x: -35;
    --_y: 1071;
}

/* .backToTop */
.backToTop {
    position: fixed;
    z-index: 50;
    right: clamp(0.625rem, -0.4109116022rem + 4.4198895028vw, 3.125rem);
    display: flex;
    flex-direction: column;
    width: clamp(3.125rem, 2.3221685083rem + 3.4254143646vw, 5.0625rem);
    opacity: 0;
    justify-content: space-between;
    align-items: center;
    aspect-ratio: 27/17;
}

.backToTop__img {
    width: 100%;
    height: 100%;
}

.backToTop__img img {
    width: 100%;
    height: 100%;
}

.entry-content {
    /*width: 100% !important;*/
}

.entry-content img {
    max-width: 100% !important;
    height: 100% !important;
}

.pagination ul {
    gap: 10px !important;
}

.gaibu_link::after {
    content: "";
    display: inline-block;
    inline-size: 1em;
    block-size: 0.8em;
    margin-inline-start: 0.45em;
    background: url("/image/target_blank_b.png") no-repeat center / contain;
}

.back_menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

.btn-group {
    inline-size: fit-content;
    display: block flex;
    flex-direction: column;
    row-gap: 20px;
    margin: 0 auto;
}

.btn-arrow {
    font-size: clamp(0.6875rem, 0.2998167982rem + 1.5783540023vw, 1.5625rem);
    min-block-size: 35px;
    max-block-size: 70px;
    --_btn-pad-x-st: clamp(1.0625rem, 0.7025084555rem + 1.4656144307vw, 1.875rem);
    --_btn-pad-x-ed: clamp(0.5625rem, 0.4240417136rem + 0.5636978579vw, 0.875rem);
    --_btn-pad-y: clamp(0.53125rem, 0.2127959414rem + 1.2965050733vw, 1.25rem);
    --_append-spacing: clamp(1.25rem,
            1.1807708568rem + 0.281848929vw,
            1.40625rem);
    --_circle-size: clamp(1.125rem, 0.7927001127rem + 1.3528748591vw, 1.875rem);
    --_arrow-size: clamp(0.78125rem, 0.5735625705rem + 0.8455467869vw, 1.25rem);
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: var(--_btn-pad-y) var(--_btn-pad-x-ed) var(--_btn-pad-y) var(--_btn-pad-x-st);
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    line-height: 1;
}

.btn-normal {
    font-size: clamp(0.6875rem, 0.2998167982rem + 1.5783540023vw, 1.5625rem);
    min-block-size: 35px;
    max-block-size: 70px;
    --_btn-pad-x-st: clamp(1.0625rem, 0.7025084555rem + 1.4656144307vw, 1.875rem);
    --_btn-pad-x-ed: clamp(1.0625rem, 0.7025084555rem + 1.4656144307vw, 1.875rem);
    --_btn-pad-y: clamp(0.53125rem, 0.2127959414rem + 1.2965050733vw, 1.25rem);
    --_append-spacing: clamp(1.25rem,
            1.1807708568rem + 0.281848929vw,
            1.40625rem);
    display: block grid;
    grid-template: "text after" /1fr auto;
    align-items: center;
    padding: var(--_btn-pad-y) var(--_btn-pad-x-ed) var(--_btn-pad-y) var(--_btn-pad-x-st);
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border-radius: calc(infinity * 1px);
    line-height: 1;
}

.btn-normal.btn--filled {
    text-align: revert;
}

.btn-arrow.btn--filled {
    text-align: revert;
}

.btn-arrow.btn--filled::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: var(--_circle-size);
    block-size: var(--_circle-size);
    margin-inline-start: var(--_append-spacing);
    border-radius: calc(infinity * 1px);
    background: #fff url("/anp@2x.png") no-repeat center/var(--_arrow-size);
}

.btn-arrow.btn--outlined {
    text-align: revert;
}

.btn-arrow.btn--outlined::after {
    grid-area: after;
    content: "";
    display: block flow;
    inline-size: var(--_circle-size);
    block-size: var(--_circle-size);
    margin-inline-start: var(--_append-spacing);
    border-radius: calc(infinity * 1px);
    background: var(--main-color) url("/anf@2x.png") no-repeat center/var(--_arrow-size);
}

.btn--filled {
    background: var(--main-color);
    color: #fff;
    transition: background-color 0.3s;
}

.btn--filled:disabled,
.btn--filled[aria-disabled="true"] {
    background-color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    .btn--filled:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 70%, #fff);
    }
}

.btn--outlined {
    color: var(--main-color);
    box-shadow: inset 0 0 0 2px currentColor;
    background-color: #fff;
    transition: background-color 0.3s;
}

.btn--outlined:disabled,
.btn--outlined[aria-disabled="true"] {
    color: oklch(from var(--main-color) calc(l + 0.2) calc(c - 0.1) h);
}

@media (any-hover: hover) {
    .btn--outlined:not(:disabled, [aria-disabled="true"]):hover {
        background-color: color-mix(in srgb, var(--main-color) 15%, #fff);
    }
}