@charset "UTF-8";
/* =========================================================
   S-passo リリース記念キャンペーン LP
   構成・数値・モーションは INTLOOP 20周年特設サイトの文法を踏襲
   ========================================================= */

/* ---------- reset ---------- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:where(html) { -webkit-text-size-adjust: none; }
:where(body) { line-height: 1.5; -webkit-font-smoothing: antialiased; }
:where(input, button, textarea, select) { font: inherit; color: inherit; }
:where(textarea) { resize: vertical; }
:where(button, label, select, summary) { cursor: pointer; }
:where(button) { border-style: solid; }
:where(a) { text-underline-offset: .2ex; }
:where(ul, ol) { list-style: none; }
:where(img, svg, video, canvas) { display: block; }
:where(img, picture, svg) { max-inline-size: 100%; block-size: auto; }
:where(p, h1, h2, h3, h4, h5, h6) { overflow-wrap: break-word; }
:where(h1, h2, h3) { line-height: calc(1em + .5rem); }

/* ---------- font ---------- */
.f-en--100 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 100; font-style: normal; }
.f-en--200 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 200; font-style: normal; }
.f-en--300 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 300; font-style: normal; }
.f-en--400 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
.f-en--500 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }
.f-en--600 { font-family: "Albert Sans", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; }

.f-jp--m { font-family: "Yu Gothic Medium", "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; }
.f-jp--d { font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif; font-weight: 600; font-style: normal; }
.f-jp--b { font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; }

/* ---------- base ---------- */
:root {
    --c-blue: #1e56d6;
    --c-blue-dark: #0a2a8c;
    --c-blue-deep: #002aaf;
    --c-sky: #00adff;
    --c-pale: #a7cdf5;
    --c-accent: #ff8245;
    --c-teal: #00cecc;
    --c-text: #434343;
}

html { overflow-x: hidden; }
body {
    display: none;
    opacity: 0;
    width: 100%;
    max-width: 100%;
    background: #fff;
    color: var(--c-text);
    font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif;
    overflow-x: hidden;
}
body.load-init { display: block; opacity: 1; }
body.is-loading { pointer-events: none; }
#top { position: absolute; top: 0; left: 0; }

.pc-show { display: block; }
.sp-show { display: none; }
@media screen and (max-width: 768px) {
    .pc-show { display: none; }
    .sp-show { display: block; }
}

@keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ---------- cue anime（参考CSSと同値） ---------- */
.cue-anime-01 { opacity: 0; transform: translate3d(0, -50px, 0) rotate(.001deg); transition: 1.1s cubic-bezier(.165, .84, .44, 1); }
.cue-anime-01.-in { opacity: 1; transform: translate3d(0, 0, 0) rotate(.001deg); }
.cue-anime-02 { opacity: 0; transform: translate3d(0, 50px, 0) rotate(.001deg); transition: 1.1s cubic-bezier(.165, .84, .44, 1); }
.cue-anime-02.-in { opacity: 1; transform: translate3d(0, 0, 0) rotate(.001deg); }
.cue-anime-03 { filter: blur(10px); opacity: 0; transform: translateY(10px); transition: filter .54s ease, opacity .54s ease, transform .54s ease; }
.cue-anime-03.-in { filter: blur(0); opacity: 1; transform: translateY(0); }

/* =========================================================
   header
   ========================================================= */
.headerArea {
    position: fixed;
    top: 0; left: 0;
    z-index: 999;
    opacity: 0;
    transition: .3s ease-in-out;
}
.headerArea.is-show { opacity: 1; }
.headerArea .logo {
    display: block;
    padding: 12px 36px 14px;
    border-radius: 0 0 50px 0;
    background: hsla(0, 0%, 100%, .9);
}
.headerArea img { display: block; max-width: 11.5972222222vw; width: 100%; }
@media screen and (min-width: 1441px) { .headerArea img { max-width: 167px; } }
@media screen and (max-width: 768px) {
    .headerArea .logo { padding: 9px 27px 11px; border-radius: 0 0 80px 0; }
    .headerArea img { max-width: 130px; }
}

/* =========================================================
   右下 固定エントリーボタン ＋ 吹き出し
   ========================================================= */
.entryFloatArea {
    position: fixed;
    right: 18px; bottom: 12px;
    max-width: 108px; width: 100%; height: 108px;
    border-radius: 100%;
    background: #fff;
    box-shadow: 0 4px 24px rgba(10, 42, 140, .12);
    transition: .3s ease-in-out;
    z-index: 999;
    opacity: 0;
    pointer-events: none;
}
.entryFloatArea.-in { opacity: 1; pointer-events: auto; }
.entryFloatArea.is-hide { opacity: 0; pointer-events: none; }
.entryFloatArea .innerBlock { position: relative; width: 100%; height: 100%; }
.entryFloatArea .item {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    width: 92px; height: 92px; margin: auto;
    border-radius: 100%;
    background: var(--c-blue);
    text-decoration: none;
    transition: .3s ease-in-out;
}
.entryFloatArea .item:hover { background: var(--c-blue-deep); }
.entryFloatArea .ring {
    position: absolute; inset: -8px;
    border: 1px solid var(--c-blue);
    border-radius: 100%;
    opacity: .35;
    animation: floatRing 2.4s ease-out infinite;
}
@keyframes floatRing {
    0% { transform: scale(.92); opacity: .5; }
    70% { transform: scale(1.12); opacity: 0; }
    100% { transform: scale(1.12); opacity: 0; }
}
.entryFloatArea .mark { color: #fff; font-size: 34px; line-height: 1; letter-spacing: -1px; }
.entryFloatArea .mark .yen { font-family: "Yu Gothic", YuGothic, sans-serif; font-weight: 700; font-size: 15px; margin-left: 1px; }
@media screen and (min-width: 769px) {
    .entryFloatArea:hover + .balloonArea { opacity: 1; transform: translate3d(0, 0, 0) rotate(.001deg); }
}
@media screen and (max-width: 768px) {
    .entryFloatArea { max-width: 85px; height: 85px; right: 20px; bottom: 80px; }
    .entryFloatArea .item { width: 70px; height: 70px; }
    .entryFloatArea .mark { font-size: 27px; }
}

.balloonArea {
    pointer-events: none;
    position: fixed;
    right: 17px; bottom: 130px;
    min-width: 124px; width: fit-content; min-height: 52px;
    padding: 5px 23px 10px;
    border-radius: 26px;
    background: hsla(0, 0%, 100%, .86);
    box-shadow: 0 2px 14px rgba(10, 42, 140, .1);
    z-index: 999;
    opacity: 0;
    transform: translate3d(0, 10px, 0) rotate(.001deg);
    transition: 1.1s cubic-bezier(.165, .84, .44, 1);
}
.balloonArea.-in { opacity: 1; transform: translate3d(0, 0, 0) rotate(.001deg); }
.balloonArea .contents { text-align: center; }
.balloonArea .text { display: block; color: var(--c-blue); font-size: 13px; line-height: 1.6; letter-spacing: .6px; white-space: nowrap; }
.balloonArea .num { display: inline-block; margin: 0 3px; font-size: 20px; }
.balloonArea .arrow { position: absolute; right: 40px; bottom: -8px; }
@media screen and (max-width: 768px) {
    .balloonArea { right: 20px; bottom: 176px; min-width: 108px; padding: 4px 16px 8px; }
    .balloonArea .text { font-size: 12px; }
}

/* =========================================================
   メインビジュアル
   ========================================================= */
.mainVisualArea { position: relative; width: 100%; height: 100svh; overflow: hidden; }
.mainVisualArea .innerBlock { width: 100%; height: 100%; }

.mainVisualArea .circleItem {
    pointer-events: none;
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    margin: auto;
    opacity: 0;
    transform: scale(.9);
    transition: 1s ease-in-out;
}
.mainVisualArea .circleItem.--scale-min { transition: 2s ease-in-out; transform: scale(.5); }
.mainVisualArea .circleItem.is-active { opacity: 1; transform: scale(1); }
.mainVisualArea .circleItem .item {
    display: block;
    position: absolute; inset: 0;
    width: 100%; margin: auto;
    opacity: 0;
    transition: .3s ease-in-out;
}
.mainVisualArea .circleItem .item.is-active { opacity: 1; }
.mainVisualArea .circleItem .item img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; margin: auto; }

.mainVisualArea .circleItem .item.--01 { max-width: 50.7638888889vw; height: 50.5555555556vw; animation: rotation 10s linear infinite; }
.mainVisualArea .circleItem .item.--02 { max-width: 67.2916666667vw; height: 69.5138888889vw; animation: rotation 10s linear reverse infinite; }
.mainVisualArea .circleItem .item.--03 { max-width: 84.0972222222vw; height: 83.3333333333vw; animation: rotation 20s linear infinite; }
.mainVisualArea .circleItem .item.--04 { max-width: 101.1805555556vw; height: 92.9861111111vw; animation: rotation 30s linear reverse infinite; }
@media screen and (min-width: 1441px) {
    .mainVisualArea .circleItem .item.--01 { max-width: 731px; height: 728px; }
    .mainVisualArea .circleItem .item.--02 { max-width: 969px; height: 1001px; }
    .mainVisualArea .circleItem .item.--03 { max-width: 1211px; height: 1200px; }
    .mainVisualArea .circleItem .item.--04 { max-width: 1457px; height: 1339px; }
}
@media screen and (max-width: 768px) {
    .mainVisualArea .circleItem .item.--01,
    .mainVisualArea .circleItem .item.--02,
    .mainVisualArea .circleItem .item.--03,
    .mainVisualArea .circleItem .item.--04 { max-width: none; height: auto; }
    .mainVisualArea .circleItem .item.--01 .img { transform: scale(.94); }
    .mainVisualArea .circleItem .item.--02 .img { transform: scale(1.27); }
    .mainVisualArea .circleItem .item.--03 .img { transform: scale(1.59); }
    .mainVisualArea .circleItem .item.--04 .img { transform: scale(1.88); }
}

.mainVisualArea .logoItem {
    position: absolute; inset: 0;
    width: fit-content; height: fit-content;
    margin: auto;
}
.mainVisualArea .logoItem img { max-width: 26.0416666667vw; width: 100%; margin: auto; }
@media screen and (min-width: 1441px) { .mainVisualArea .logoItem img { max-width: 375px; } }
@media screen and (max-width: 768px) { .mainVisualArea .logoItem img { max-width: 62vw; } }

.mainVisualArea .logoItem .title {
    position: relative;
    margin-top: 1.6666666667vw;
    padding-top: .8333333333vw;
    color: var(--c-blue);
    text-align: center;
    font-size: clamp(.8125rem, .7904929577rem + .0938967136vw, .875rem);
    letter-spacing: 1.4px;
}
@media screen and (min-width: 1441px) { .mainVisualArea .logoItem .title { margin-top: 24px; padding-top: 12px; } }
@media screen and (max-width: 768px) { .mainVisualArea .logoItem .title { margin-top: 14px; padding-top: 7px; letter-spacing: 1.3px; } }
.mainVisualArea .logoItem .title::before {
    content: ""; display: block;
    position: absolute; top: 0; left: 0;
    width: 100%; height: 1px;
    background: var(--c-blue);
    opacity: .3;
}
@media screen and (max-width: 768px) { .mainVisualArea .logoItem .title::before { right: 0; width: 162px; margin: auto; } }

.mainVisualArea .crackerItem { pointer-events: none; position: absolute; inset: 0; width: 100%; height: 100%; margin: auto; }
.mainVisualArea .crackerItem .item {
    display: block;
    position: absolute; inset: 0;
    width: 100%; height: fit-content; margin: auto;
    opacity: 0;
    transform: translate3d(0, 50px, 0) rotate(.001deg);
    transition: 1.1s cubic-bezier(.165, .84, .44, 1);
}
.mainVisualArea .crackerItem.-in .item { opacity: 1; transform: translate3d(0, 0, 0) rotate(.001deg); }
.mainVisualArea .crackerItem .item.--03,
.mainVisualArea .crackerItem .item.--04 { transition-delay: .2s; }
.mainVisualArea .crackerItem .item.--05 { transition-delay: .3s; }

/* =========================================================
   contents
   ========================================================= */
.contentsArea { position: relative; z-index: 1; }
.innerContents { position: relative; background: #fbfbfd; }
.contentsArea .circleImg.--top { position: relative; margin-bottom: -1px; line-height: 0; background: #fff; }
.contentsArea .circleImg.--top svg { width: 100%; height: 8.3333333333vw; }
@media screen and (min-width: 1441px) { .contentsArea .circleImg.--top svg { height: 120px; } }
@media screen and (max-width: 768px) { .contentsArea .circleImg.--top svg { height: 56px; } }

/* ---------- copyArea ---------- */
.copyArea { position: relative; padding-top: 42px; }
@media screen and (max-width: 768px) { .copyArea { padding-top: 94px; } }
.copyArea .innerBlock { width: fit-content; margin: auto; }
@media screen and (max-width: 768px) { .copyArea .innerBlock { width: auto; margin: 0 20px; } }
.copyArea .title {
    margin-bottom: 32px;
    color: var(--c-blue);
    text-align: center;
    font-size: clamp(1.4375rem, .9753521127rem + 1.9718309859vw, 2.75rem);
    letter-spacing: 8.8px;
}
@media screen and (max-width: 768px) { .copyArea .title { margin-bottom: 14px; letter-spacing: 4.6px; } }
.copyArea .text {
    color: var(--c-text);
    text-align: center;
    font-size: clamp(1rem, .9339788732rem + .2816901408vw, 1.1875rem);
    line-height: 240%;
    letter-spacing: 1.9px;
}
@media screen and (max-width: 768px) { .copyArea .text { line-height: 250%; letter-spacing: 1.6px; } }
.copyArea .text + .text { margin-top: 50px; }

.copyArea .crackerItem { pointer-events: none; position: absolute; inset: 0; width: 100%; height: 100%; margin: auto; }
@media screen and (min-width: 1441px) { .copyArea .crackerItem { max-width: 1440px; left: 0; right: 0; } }
.copyArea .crackerItem .item { position: absolute; width: 100%; }
.copyArea .crackerItem .item.--01 { top: -3.4722222222vw; left: -4.1666666667vw; max-width: 32.3611111111vw; }
.copyArea .crackerItem .item.--02 { top: -6.9444444444vw; right: 0; max-width: 25.5555555556vw; }
@media screen and (min-width: 1441px) {
    .copyArea .crackerItem .item.--01 { top: -50px; left: -60px; max-width: 466px; }
    .copyArea .crackerItem .item.--02 { top: -100px; max-width: 368px; }
}
@media screen and (max-width: 768px) {
    .copyArea .crackerItem .item.--01 { top: -60px; left: 10px; max-width: 302px; }
    .copyArea .crackerItem .item.--02 { top: auto; left: 20px; bottom: -130px; max-width: 291px; }
}

/* ---------- カルーセル ---------- */
.carouselArea { position: relative; margin-top: 190px; }
@media screen and (max-width: 768px) { .carouselArea { margin-top: 177px; } }
.carouselArea .counterHead { position: relative; margin-bottom: 70px; z-index: 3; }
@media screen and (max-width: 768px) { .carouselArea .counterHead { margin-bottom: 31px; } }
.carouselArea .counterHead .detail {
    display: flex; justify-content: center; align-items: center;
    color: var(--c-text);
    font-size: clamp(1.125rem, .9269366197rem + .8450704225vw, 1.6875rem);
    text-align: center;
    line-height: normal;
    letter-spacing: 2.7px;
}
@media screen and (max-width: 768px) { .carouselArea .counterHead .detail { flex-wrap: wrap; letter-spacing: 1.8px; } }
.carouselArea .counterHead .detail + .detail { margin-top: 7px; }
.carouselArea .counterHead .t { display: block; }
@media screen and (max-width: 768px) { .carouselArea .counterHead .t.--sp-block { width: 100%; } }
.carouselArea .counterHead .num,
.carouselArea .counterHead .em {
    height: fit-content; margin: 0 11px;
    border-radius: 3px;
    color: #fff;
    overflow: hidden;
}
.carouselArea .counterHead .num { padding: 3px 8px; background: var(--c-blue); }
.carouselArea .counterHead .em { padding: 0 19px; background: var(--c-accent); color: #fefeff; }
@media screen and (max-width: 768px) {
    .carouselArea .counterHead .num, .carouselArea .counterHead .em { margin: 0 4px; }
    .carouselArea .counterHead .em { padding: 0 8px; }
}
.carouselArea .counterHead .wrap { display: inline-block; }

.commentCarousel { position: relative; overflow: hidden; }
.commentCarousel + .commentCarousel { margin-top: 28px; }
@media screen and (max-width: 768px) { .commentCarousel + .commentCarousel { margin-top: 10px; } }
.carouselTrack { display: flex; width: max-content; will-change: transform; }
.carouselTrack .item {
    position: relative;
    flex: 0 0 auto;
    max-width: 25.2777777778vw; width: 25.2777777778vw;
    min-height: 12.5vw;
    margin-right: 1.3888888889vw;
    border-radius: .6944444444vw;
    padding: 1.7361111111vw 1.7361111111vw .7638888889vw;
    background: var(--c-blue);
}
@media screen and (max-width: 1441px) {
    .carouselTrack .item { max-width: 364px; width: 364px; min-height: 180px; margin-right: 20px; border-radius: 10px; padding: 25px 25px 11px; }
}
@media screen and (max-width: 768px) {
    .carouselTrack .item { max-width: 255px; width: 255px; min-height: 198px; margin-right: 10px; border-radius: 10px; padding: 13px 15px 10px; }
}
.carouselTrack .text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
    overflow: hidden;
    color: #fff;
    min-height: 6.9444444444vw;
    text-align: justify;
    font-size: .875rem;
    line-height: 180%;
    letter-spacing: 1.4px;
}
@media screen and (max-width: 1441px) { .carouselTrack .text { min-height: 100px; } }
@media screen and (max-width: 768px) { .carouselTrack .text { min-height: 120px; } }
.carouselTrack .icon { position: absolute; bottom: 0; left: 1.1805555556vw; max-width: 4.8611111111vw; width: 100%; }
.carouselTrack .icon svg { width: 100%; height: auto; }
@media screen and (max-width: 1441px) { .carouselTrack .icon { left: 17px; max-width: 70px; } }
@media screen and (max-width: 768px) { .carouselTrack .icon { left: 10px; max-width: 48px; } }
.carouselTrack .profile {
    margin-top: 1.1111111111vw;
    padding-left: 6.9444444444vw;
    color: #fff;
    text-align: right;
    font-size: clamp(.625rem, .5809859155rem + .1877934272vw, .75rem);
    line-height: 180%;
    letter-spacing: 1.2px;
}
@media screen and (max-width: 1441px) { .carouselTrack .profile { margin-top: 16px; padding-left: 100px; } }
@media screen and (max-width: 768px) { .carouselTrack .profile { padding-left: 40px; margin-top: 18px; letter-spacing: 1px; } }
.carouselTrack .profile span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.carouselTrack .profile .company { opacity: .8; font-size: .9em; }
.carouselTrack .profile .name { font-size: 1.16em; letter-spacing: .8px; }

/* ---------- エントリーフォーム ---------- */
.commentFormArea { margin-top: 116px; }
@media screen and (max-width: 768px) { .commentFormArea { margin-top: 60px; } }
.commentFormArea .innerBlock { position: relative; max-width: 664px; width: 100%; margin: auto; z-index: 3; }
@media screen and (max-width: 768px) { .commentFormArea .innerBlock { max-width: none; width: auto; } }
.commentFormArea .head .img { display: block; max-width: 31px; width: 100%; margin: auto; }
.commentFormArea .head .img svg { width: 100%; height: auto; }
.commentFormArea .head .title {
    margin-top: 8px;
    color: #444;
    text-align: center;
    font-size: clamp(1.125rem, .9269366197rem + .8450704225vw, 1.6875rem);
    line-height: 160%;
    letter-spacing: 2.7px;
}
@media screen and (max-width: 768px) { .commentFormArea .head .title { margin-top: 25px; letter-spacing: 1.8px; } }
.commentFormArea .head .text {
    margin-top: 4px;
    color: #444;
    text-align: center;
    font-size: clamp(.8125rem, .7904929577rem + .0938967136vw, .875rem);
    line-height: 180%;
    letter-spacing: 1.4px;
}
.commentFormArea .contents {
    position: relative;
    margin-top: 39px;
    padding: 40px 67px;
    border-radius: 20px;
    background: var(--c-blue);
}
@media screen and (max-width: 768px) { .commentFormArea .contents { margin: 21px 20px 0; padding: 38px 20px 34px; } }
/* 申込条件リスト＋CTA（フォームの代わりに /consult へ送客する） */
.entryList { display: block; }
.entryList li {
    position: relative;
    padding-left: 30px;
    color: #fff;
    font-size: clamp(.875rem, .8309859155rem + .1877934272vw, 1rem);
    line-height: 170%;
    letter-spacing: 1px;
}
.entryList li + li { margin-top: 11px; }
.entryList li::before {
    content: ""; position: absolute; top: .55em; left: 0;
    width: 18px; height: 10px;
    border-left: 2.4px solid #fff; border-bottom: 2.4px solid #fff;
    transform: rotate(-45deg) scale(.86);
    transform-origin: left center;
    opacity: .95;
}
@media screen and (max-width: 768px) {
    .entryList li { padding-left: 26px; letter-spacing: .4px; }
}
.entryBtns { display: flex; gap: 0 16px; margin-top: 30px; }
@media screen and (max-width: 768px) { .entryBtns { display: block; margin-top: 24px; } }
.entryBtn {
    display: flex; align-items: center; justify-content: center;
    position: relative;
    width: 100%; min-height: 60px;
    padding: 0 34px;
    border-radius: 45px;
    font-size: clamp(.875rem, .8309859155rem + .1877934272vw, 1rem);
    letter-spacing: .8px;
    text-decoration: none;
    transition: .3s ease-in-out;
}
.entryBtn + .entryBtn { margin-top: 0; }
@media screen and (max-width: 768px) { .entryBtn + .entryBtn { margin-top: 12px; } }
.entryBtn .arw { position: absolute; right: 20px; font-size: 1.2em; line-height: 1; }
.entryBtn.--solid { background: #fff; color: var(--c-blue); box-shadow: 0 6px 18px rgba(4, 20, 70, .18); }
.entryBtn.--line { border: 2px solid hsla(0, 0%, 100%, .85); color: #fff; }
@media screen and (min-width: 769px) {
    .entryBtn.--solid:hover { background: #eaf1ff; }
    .entryBtn.--line:hover { background: hsla(0, 0%, 100%, .14); }
}

.entry-form { display: flex; flex-wrap: wrap; }
.form-row { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.form-row + .form-row { margin-top: 15px; }
.form-row--textarea { align-items: flex-start; }
.entry-form label {
    display: block; max-width: 118px; width: 100%;
    color: #fff;
    font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-weight: 700;
    font-size: .875rem;
    line-height: 130%;
}
.entry-form label .small { font-size: .75rem; }
.entry-form input,
.entry-form textarea,
.entry-form select {
    max-width: 419px; width: 100%;
    padding: 9px 11px;
    border: 0; border-radius: 2px;
    font-size: clamp(.875rem, .8309859155rem + .1877934272vw, 1rem);
    background: hsla(0, 0%, 100%, .8);
    font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-weight: 400;
    color: var(--c-text);
    outline: none;
}
.entry-form .selectWrap { position: relative; max-width: 419px; width: 100%; }
.entry-form select { appearance: none; max-width: none; padding-right: 30px; }
.entry-form .selectWrap::after {
    content: ""; position: absolute; top: 50%; right: 12px;
    width: 7px; height: 7px; margin-top: -5px;
    border-right: 1.6px solid #7a7a7a; border-bottom: 1.6px solid #7a7a7a;
    transform: rotate(45deg);
    pointer-events: none;
}
.entry-form input::placeholder, .entry-form textarea::placeholder { color: #aaa; }
.entry-form input.is-error, .entry-form textarea.is-error, .entry-form select.is-error { box-shadow: 0 0 0 2px #ffd2c0; }
@media screen and (max-width: 768px) {
    .form-row { display: block; }
    .entry-form label { max-width: none; width: auto; }
    .entry-form input, .entry-form textarea, .entry-form .selectWrap { max-width: none; margin-top: 5px; }
}
.commentFormArea .attention {
    text-align: right;
    margin-top: 19px;
    color: #fff;
    font-size: 12px;
    line-height: 160%;
    opacity: .7;
}
@media screen and (max-width: 768px) { .commentFormArea .attention { margin-top: 21px; padding-left: 54px; text-align: right; } }
.commentFormArea .icon { position: absolute; bottom: 0; left: 42px; max-width: 70px; width: 100%; }
@media screen and (max-width: 768px) { .commentFormArea .icon { max-width: 48px; left: 15px; } }

.customSubmitButton {
    display: flex; align-items: center; justify-content: center;
    border: none;
    max-width: 224px; width: 100%; height: 62px;
    margin: 44px auto 0;
    border-radius: 45px;
    color: #fff;
    background: var(--c-blue);
    font-size: clamp(.875rem, .8309859155rem + .1877934272vw, 1rem);
    line-height: 130%;
    letter-spacing: .8px;
    transition: .3s ease-in-out;
}
@media screen and (min-width: 769px) { .customSubmitButton:hover { background: var(--c-blue-deep); } }
@media screen and (max-width: 768px) { .customSubmitButton { margin: 30px auto 0; letter-spacing: .7px; } }
.formAttentionText {
    font-size: clamp(.875rem, .8309859155rem + .1877934272vw, 1rem);
    line-height: 200%;
    letter-spacing: .8px;
    text-align: center;
}
.formAttentionText .successText { color: var(--c-blue); }
.formAttentionText .errorText { color: #ff3131; }
.recaptchaText {
    margin-top: 34px;
    color: #5e5e5e;
    text-align: center;
    font-size: .625rem;
    line-height: 160%;
    letter-spacing: .5px;
    opacity: .5;
}

/* ---------- STEP（storyArea） ---------- */
.storyArea { position: relative; margin-top: 130px; overflow: hidden; }
@media screen and (max-width: 768px) { .storyArea { margin-top: 90px; } }
.storyArea .innerBlock { position: relative; }
.storyArea .contents { position: relative; }
.storyArea .storyItem { position: relative; }
.storyArea .storyItem .inner {
    position: relative;
    background: #0a2a5c;
    padding: 8.8888888889vw 0 0;
    transition: background-color .6s ease-in-out;
}
@media screen and (min-width: 1441px) { .storyArea .storyItem .inner { padding: 128px 0 0; } }
@media screen and (max-width: 768px) { .storyArea .storyItem .inner { padding: 66px 0 0; } }
.storyArea .storyItem .inner + .inner { padding-top: 8.3333333333vw; }
@media screen and (min-width: 1441px) { .storyArea .storyItem .inner + .inner { padding-top: 120px; } }
@media screen and (max-width: 768px) { .storyArea .storyItem .inner + .inner { padding-top: 80px; } }

.storyArea .step { position: relative; width: fit-content; margin: 0 auto; text-align: center; }
.storyArea .step .text { display: block; color: #fff; font-size: 4.4444444444vw; line-height: 1; opacity: .92; }
@media screen and (min-width: 1441px) { .storyArea .step .text { font-size: 64px; } }
@media screen and (max-width: 768px) { .storyArea .step .text { font-size: 42px; } }
.storyArea .step .dot { width: 9px; height: 9px; margin: 18px auto 0; border-radius: 100%; background: #fff; opacity: .9; }
.storyArea .step::after {
    content: ""; display: block;
    width: 1px; height: 4.8611111111vw;
    margin: 10px auto 0;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, .8), hsla(0, 0%, 100%, 0));
}
@media screen and (min-width: 1441px) { .storyArea .step::after { height: 70px; } }
@media screen and (max-width: 768px) { .storyArea .step::after { height: 44px; } }

.storyArea .detailItem {
    display: flex; align-items: center; justify-content: space-between;
    gap: 0 3.4722222222vw;
    max-width: 76.3888888889vw; width: 100%;
    margin: 3.4722222222vw auto 0;
    padding-bottom: 4.8611111111vw;
}
@media screen and (min-width: 1441px) { .storyArea .detailItem { max-width: 1100px; gap: 0 50px; margin-top: 50px; padding-bottom: 70px; } }
@media screen and (max-width: 768px) {
    .storyArea .detailItem { display: block; max-width: none; width: auto; margin: 34px 20px 0; padding-bottom: 60px; }
}
.storyArea .detailItem .left, .storyArea .detailItem .right { flex: 0 1 auto; }

.storyArea .card {
    max-width: 32.6388888889vw; width: 100%;
    padding: 2.4305555556vw 2.2916666667vw 2.4305555556vw;
    border-radius: .6944444444vw;
    background: #fff;
}
@media screen and (min-width: 1441px) { .storyArea .card { max-width: 470px; padding: 35px 33px; border-radius: 10px; } }
@media screen and (max-width: 768px) { .storyArea .card { max-width: none; width: auto; padding: 26px 22px; border-radius: 10px; } }
.storyArea .card .stepLabel { display: block; color: var(--c-blue); font-size: 13px; letter-spacing: 2px; }
.storyArea .card .title { margin-top: 6px; color: #222; font-size: 1.6666666667vw; line-height: 150%; letter-spacing: 2.4px; }
@media screen and (min-width: 1441px) { .storyArea .card .title { font-size: 24px; } }
@media screen and (max-width: 768px) { .storyArea .card .title { font-size: 20px; letter-spacing: 1.6px; } }
.storyArea .card .text { margin-top: 12px; color: var(--c-text); font-size: .875rem; line-height: 200%; letter-spacing: 1.1px; }
.storyArea .card .detailText { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e4eaf5; }
.storyArea .card .innerTitle { color: var(--c-blue); font-size: .8125rem; letter-spacing: 1.4px; font-weight: 700; }
.storyArea .card .innerText { margin-top: 7px; color: #666; font-size: .8125rem; line-height: 190%; letter-spacing: .8px; }

.storyArea .status {
    display: block;
    max-width: 20.8333333333vw; width: 100%;
    padding: 1.6666666667vw 1.3888888889vw;
    text-align: center;
}
@media screen and (min-width: 1441px) { .storyArea .status { max-width: 300px; padding: 24px 20px; } }
@media screen and (max-width: 768px) { .storyArea .status { max-width: none; width: auto; margin: 30px auto 0; padding: 0; } }
.storyArea .status .caption { display: block; color: hsla(0, 0%, 100%, .75); font-size: .8125rem; letter-spacing: 1.6px; }
.storyArea .status .detail { margin-top: 8px; }
.storyArea .status .num { display: flex; align-items: baseline; justify-content: center; color: #fff; }
.storyArea .status .t.--max { font-size: 6.9444444444vw; line-height: 1; }
@media screen and (min-width: 1441px) { .storyArea .status .t.--max { font-size: 100px; } }
@media screen and (max-width: 768px) { .storyArea .status .t.--max { font-size: 64px; } }
.storyArea .status .t.--max.--text { font-size: 3.0555555556vw; letter-spacing: 3px; white-space: nowrap; }
@media screen and (min-width: 1441px) { .storyArea .status .t.--max.--text { font-size: 44px; } }
@media screen and (max-width: 768px) { .storyArea .status .t.--max.--text { font-size: 32px; } }
.storyArea .status .t.--min { margin-left: 6px; font-size: 1.3888888889vw; }
@media screen and (min-width: 1441px) { .storyArea .status .t.--min { font-size: 20px; } }
@media screen and (max-width: 768px) { .storyArea .status .t.--min { font-size: 16px; } }

@media screen and (max-width: 768px) {
    .storyArea .detailItem .left { order: 2; }
    .storyArea .detailItem .right { order: 1; }
    .storyArea .detailItem { display: flex; flex-direction: column; }
}

.storyArea .numArea {
    position: relative;
    padding: 5.5555555556vw 0 8.3333333333vw;
    background: #0a2a8c;
}
@media screen and (min-width: 1441px) { .storyArea .numArea { padding: 80px 0 120px; } }
@media screen and (max-width: 768px) { .storyArea .numArea { padding: 54px 20px 74px; } }
.storyArea .numList {
    display: flex; justify-content: center; align-items: flex-end;
    gap: 0 4.8611111111vw;
    max-width: 83.3333333333vw; margin: auto;
}
@media screen and (min-width: 1441px) { .storyArea .numList { max-width: 1200px; gap: 0 70px; } }
@media screen and (max-width: 768px) { .storyArea .numList { flex-wrap: wrap; max-width: none; gap: 34px 0; } }
.storyArea .numList .item { text-align: center; }
@media screen and (max-width: 768px) { .storyArea .numList .item { width: 50%; } }
.storyArea .numList .cap { display: block; color: hsla(0, 0%, 100%, .72); font-size: .8125rem; letter-spacing: 1.6px; }
.storyArea .numList .val { display: block; margin-top: 6px; color: #fff; font-size: 3.4722222222vw; line-height: 1.2; }
@media screen and (min-width: 1441px) { .storyArea .numList .val { font-size: 50px; } }
@media screen and (max-width: 768px) { .storyArea .numList .val { font-size: 36px; } }
.storyArea .numList .val em { margin-left: 3px; font-size: .375em; font-style: normal; }
.storyArea .numArea .attention { margin-top: 2.7777777778vw; color: hsla(0, 0%, 100%, .55); text-align: center; font-size: .75rem; letter-spacing: 1px; }
@media screen and (min-width: 1441px) { .storyArea .numArea .attention { margin-top: 40px; } }

/* ---------- 下部カルーセル ---------- */
.carouselArea.--bottom { position: relative; margin-top: 0; }
.carouselArea.--bottom .circleImg { position: relative; z-index: 1; line-height: 0; margin-bottom: -1px; background: #0a2a8c; }
.carouselArea.--bottom .circleImg svg { width: 100%; height: 9.0277777778vw; }
@media screen and (min-width: 1441px) { .carouselArea.--bottom .circleImg svg { height: 130px; } }
@media screen and (max-width: 768px) { .carouselArea.--bottom .circleImg svg { height: 60px; } }
.carouselArea.--bottom .innerBlock { padding-top: 8.3333333333vw; background: #fff; }
@media screen and (min-width: 1441px) { .carouselArea.--bottom .innerBlock { padding-top: 120px; } }
@media screen and (max-width: 768px) { .carouselArea.--bottom .innerBlock { padding-top: 90px; } }

/* ---------- 下部コピー ---------- */
.lowerContents { position: relative; background: #fff; }
.copyBottomArea { position: relative; z-index: 2; margin-top: 8.6111111111vw; overflow: hidden; }
@media screen and (min-width: 1441px) { .copyBottomArea { margin-top: 124px; } }
@media screen and (max-width: 768px) { .copyBottomArea { margin-top: 90px; } }
.copyBottomArea .innerBlock {
    position: relative;
    max-width: 144.3055555556vw; width: 100%; height: 144.3055555556vw;
    margin: auto;
}
@media screen and (min-width: 1441px) { .copyBottomArea .innerBlock { max-width: 2078px; height: 2078px; } }
@media screen and (max-width: 768px) { .copyBottomArea .innerBlock { max-width: none; height: 190vw; } }
.copyBottomArea .innerBlock .circleItem {
    pointer-events: none;
    display: block;
    position: absolute; top: 50%; left: 50%;
    width: 144.3055555556vw; height: 144.3055555556vw;
    transform: translate(-50%, -50%);
    border-radius: 100%;
    background: #fff;
}
@media screen and (min-width: 1441px) { .copyBottomArea .innerBlock .circleItem { width: 2078px; height: 2078px; } }
@media screen and (max-width: 768px) { .copyBottomArea .innerBlock .circleItem { width: 210vw; height: 210vw; } }
.copyBottomArea .innerBlock .circleItem .item { display: block; position: absolute; inset: 0; }
.copyBottomArea .innerBlock .circleItem .item img { width: 100%; height: 100%; }
.copyBottomArea .innerBlock .circleItem .item.--01 { animation: rotation 10s linear infinite; }
.copyBottomArea .innerBlock .circleItem .item.--02 { animation: rotation 10s linear reverse infinite; }
.copyBottomArea .innerBlock .circleItem .item.--03 { animation: rotation 20s linear infinite; }
.copyBottomArea .innerBlock .circleItem .item.--04 { animation: rotation 30s linear reverse infinite; }
.copyBottomArea .contents { position: absolute; inset: 0; width: fit-content; height: fit-content; margin: auto; }
.copyBottomArea .title { color: #222; text-align: center; font-size: 5vw; line-height: 130%; }
@media screen and (min-width: 1441px) { .copyBottomArea .title { font-size: 72px; } }
@media screen and (max-width: 768px) { .copyBottomArea .title { font-size: clamp(2rem, 1.1197183099rem + 3.7558685446vw, 4.5rem); } }
.copyBottomArea .title em { color: var(--c-blue); font-style: normal; }
.copyBottomArea .sub {
    margin: 3.5416666667vw 0 1.3888888889vw;
    color: var(--c-blue);
    text-align: center;
    font-size: 3.0555555556vw;
    line-height: normal;
    letter-spacing: 8.8px;
}
@media screen and (min-width: 1441px) { .copyBottomArea .sub { margin: 51px 0 20px; font-size: 44px; } }
@media screen and (max-width: 768px) { .copyBottomArea .sub { margin: 28px 0 18px; font-size: clamp(1.4375rem, .9753521127rem + 1.9718309859vw, 2.75rem); letter-spacing: 4.6px; } }
.copyBottomArea .text { color: var(--c-text); text-align: center; font-size: 1.3194444444vw; line-height: 240%; letter-spacing: 1.9px; }
@media screen and (min-width: 1441px) { .copyBottomArea .text { font-size: 19px; } }
@media screen and (max-width: 768px) { .copyBottomArea .text { font-size: clamp(1rem, .9339788732rem + .2816901408vw, 1.1875rem); letter-spacing: 1.6px; } }
.copyBottomArea .text + .text { margin-top: 3.8194444444vw; }
@media screen and (min-width: 1441px) { .copyBottomArea .text + .text { margin-top: 55px; } }
@media screen and (max-width: 768px) { .copyBottomArea .text + .text { margin-top: 26px; } }

/* ---------- バナー ---------- */
.bannerArea { position: relative; z-index: 2; margin-top: 5.5555555556vw; }
@media screen and (min-width: 1441px) { .bannerArea { margin-top: 80px; } }
@media screen and (max-width: 768px) { .bannerArea { margin-top: 72px; } }
.bannerArea .innerBlock { max-width: 83.3333333333vw; width: 100%; margin: auto; }
@media screen and (min-width: 1441px) { .bannerArea .innerBlock { max-width: 1200px; } }
@media screen and (max-width: 768px) { .bannerArea .innerBlock { max-width: none; width: auto; } }
.bannerArea .mainTitle { color: var(--c-text); text-align: center; font-size: 1.6666666667vw; line-height: 180%; letter-spacing: 2.4px; }
@media screen and (min-width: 1441px) { .bannerArea .mainTitle { font-size: 24px; } }
@media screen and (max-width: 768px) { .bannerArea .mainTitle { font-size: clamp(1.125rem, .9929577465rem + .5633802817vw, 1.5rem); letter-spacing: 1.8px; } }
.bannerArea span { display: block; }
.bannerArea .upper { display: flex; margin-top: 5.1944444444vw; gap: 0 1.3888888889vw; }
@media screen and (min-width: 1441px) { .bannerArea .upper { margin-top: 75px; gap: 0 20px; } }
@media screen and (max-width: 768px) { .bannerArea .upper { display: block; margin-top: 30px; } }
.bannerArea .upper .link {
    position: relative;
    display: flex; flex-direction: column; justify-content: center;
    max-width: 40.9722222222vw; width: 100%; height: 15.625vw;
    padding: 0 3.4722222222vw;
    overflow: hidden;
    border-radius: .6944444444vw;
    text-decoration: none;
    color: #fff;
    transition: .3s ease-in-out;
}
@media screen and (min-width: 1441px) { .bannerArea .upper .link { max-width: 590px; height: 225px; padding: 0 50px; border-radius: 10px; } }
@media screen and (max-width: 768px) {
    .bannerArea .upper .link { max-width: 335px; height: 123px; margin: auto; padding: 0 26px; border-radius: 10px; }
    .bannerArea .upper .link + .link { margin-top: 13px; }
}
.bannerArea .upper .link.--entry { background: linear-gradient(120deg, #002aaf 0%, #1e56d6 55%, #2f7be8 100%); }
.bannerArea .upper .link.--consult { background: linear-gradient(120deg, #0a2a5c 0%, #123fbf 60%, #00adff 100%); }
@media screen and (min-width: 769px) { .bannerArea .upper .link:hover { filter: brightness(1.08); } }
.bannerArea .upper .ttl { font-size: 2.7777777778vw; line-height: 1.2; }
@media screen and (min-width: 1441px) { .bannerArea .upper .ttl { font-size: 40px; } }
@media screen and (max-width: 768px) { .bannerArea .upper .ttl { font-size: 26px; } }
.bannerArea .upper .sub { margin-top: 8px; font-size: 1.1111111111vw; letter-spacing: 1.6px; }
@media screen and (min-width: 1441px) { .bannerArea .upper .sub { font-size: 16px; } }
@media screen and (max-width: 768px) { .bannerArea .upper .sub { font-size: 14px; } }
.bannerArea .upper .icon,
.bannerArea .office .icon,
.bannerArea .contact .icon {
    display: flex; align-items: center; justify-content: center;
    position: absolute; right: 1.6666666667vw; bottom: 1.6666666667vw;
    width: 36px; height: 36px;
    border-radius: 100%;
    border: 1px solid hsla(0, 0%, 100%, .7);
}
@media screen and (min-width: 1441px) { .bannerArea .upper .icon, .bannerArea .office .icon, .bannerArea .contact .icon { right: 24px; bottom: 24px; } }
@media screen and (max-width: 768px) { .bannerArea .upper .icon, .bannerArea .office .icon, .bannerArea .contact .icon { right: 14px; bottom: 14px; width: 30px; height: 30px; } }
.bannerArea .icon svg { width: 12px; height: 12px; }

.bannerArea .lower { margin-top: 2.9861111111vw; }
@media screen and (min-width: 1441px) { .bannerArea .lower { margin-top: 43px; } }
@media screen and (max-width: 768px) { .bannerArea .lower { margin-top: 23px; } }
.bannerArea .office {
    position: relative;
    display: flex; align-items: center;
    height: 15.625vw;
    border-radius: .6944444444vw;
    background: #fff;
    border: 1px solid #e6ecf8;
    text-decoration: none;
    overflow: hidden;
}
@media screen and (min-width: 1441px) { .bannerArea .office { height: 225px; border-radius: 10px; } }
@media screen and (max-width: 768px) { .bannerArea .office { display: block; max-width: 335px; height: auto; margin: auto; border-radius: 10px; } }
.bannerArea .office .left {
    position: relative;
    display: flex; align-items: center;
    max-width: 47.5694444444vw; width: 100%; height: 100%;
    background: linear-gradient(115deg, #002aaf 0%, #1e56d6 60%, #4e9bf5 100%);
    clip-path: circle(47.2222222222vw at left);
}
@media screen and (min-width: 1441px) { .bannerArea .office .left { max-width: 685px; clip-path: circle(680px at left); } }
@media screen and (max-width: 768px) { .bannerArea .office .left { max-width: none; height: 150px; clip-path: none; } }
.bannerArea .office .left .detail { margin-left: 5.5555555556vw; color: #fff; }
@media screen and (min-width: 1441px) { .bannerArea .office .left .detail { margin-left: 80px; } }
@media screen and (max-width: 768px) { .bannerArea .office .left .detail { margin: 0 auto; text-align: center; } }
.bannerArea .office .left .sub { font-size: 1.25vw; line-height: 130%; }
@media screen and (min-width: 1441px) { .bannerArea .office .left .sub { font-size: 18px; } }
@media screen and (max-width: 768px) { .bannerArea .office .left .sub { font-size: 15px; } }
.bannerArea .office .left .text { margin-top: .4861111111vw; font-size: 4.5138888889vw; line-height: 130%; }
@media screen and (min-width: 1441px) { .bannerArea .office .left .text { margin-top: 7px; font-size: 65px; } }
@media screen and (max-width: 768px) { .bannerArea .office .left .text { font-size: 40px; } }
.bannerArea .office .right { position: absolute; top: 0; right: 3.5416666667vw; bottom: 0; max-width: 28.75vw; height: fit-content; margin: auto; color: var(--c-text); }
@media screen and (min-width: 1441px) { .bannerArea .office .right { right: 51px; max-width: 414px; } }
@media screen and (max-width: 768px) { .bannerArea .office .right { position: relative; right: 0; max-width: none; margin: 14px 20px 0; padding-bottom: 27px; } }
.bannerArea .office .right .name { font-size: 1.25vw; line-height: 180%; letter-spacing: 1.8px; }
@media screen and (min-width: 1441px) { .bannerArea .office .right .name { font-size: 18px; } }
@media screen and (max-width: 768px) { .bannerArea .office .right .name { font-size: 15px; letter-spacing: .775px; } }
.bannerArea .office .right .text { margin-top: .2083333333vw; font-size: 1.1111111111vw; line-height: 180%; letter-spacing: 1.6px; }
@media screen and (min-width: 1441px) { .bannerArea .office .right .text { margin-top: 3px; font-size: 16px; } }
@media screen and (max-width: 768px) { .bannerArea .office .right .text { font-size: 13px; letter-spacing: .65px; } }
.bannerArea .office .icon { border-color: var(--c-blue); }

.bannerArea .contact {
    position: relative;
    display: flex; justify-content: space-between; align-items: center;
    max-width: 60.9027777778vw; height: 24.3055555556vw;
    margin: 8.75vw auto 0;
    color: #fff;
    border-radius: .6944444444vw;
    background: linear-gradient(120deg, #0a2a5c 0%, #002aaf 50%, #1e56d6 100%);
    text-decoration: none;
    overflow: hidden;
    transition: .3s ease-in-out;
}
@media screen and (min-width: 1441px) { .bannerArea .contact { max-width: 877px; height: 350px; margin: 126px auto 0; border-radius: 10px; } }
@media screen and (max-width: 768px) { .bannerArea .contact { display: block; max-width: 335px; height: 217px; margin: 34px auto 0; padding: 40px 26px; border-radius: 10px; } }
@media screen and (min-width: 769px) { .bannerArea .contact:hover { filter: brightness(1.08); } }
.bannerArea .contact .left { position: relative; margin-left: 6.5972222222vw; }
@media screen and (min-width: 1441px) { .bannerArea .contact .left { margin-left: 95px; } }
@media screen and (max-width: 768px) { .bannerArea .contact .left { margin: 0; } }
.bannerArea .contact .right { position: relative; margin-right: 10.4861111111vw; }
@media screen and (min-width: 1441px) { .bannerArea .contact .right { margin-right: 151px; } }
@media screen and (max-width: 768px) { .bannerArea .contact .right { margin: 14px 0 0; } }
.bannerArea .contact .title { font-size: 4.375vw; line-height: 130%; }
@media screen and (min-width: 1441px) { .bannerArea .contact .title { font-size: 63px; } }
@media screen and (max-width: 768px) { .bannerArea .contact .title { font-size: 38px; } }
.bannerArea .contact .sub { margin-top: 4px; font-size: 1.1111111111vw; letter-spacing: 1.6px; }
@media screen and (min-width: 1441px) { .bannerArea .contact .sub { font-size: 16px; } }
@media screen and (max-width: 768px) { .bannerArea .contact .sub { font-size: 14px; } }
.bannerArea .contact .right .text { font-size: 1.1111111111vw; line-height: 190%; letter-spacing: 1.6px; }
@media screen and (min-width: 1441px) { .bannerArea .contact .right .text { font-size: 16px; } }
@media screen and (max-width: 768px) { .bannerArea .contact .right .text { font-size: 13px; } }

/* ---------- 右サイド STEPナビ ---------- */
.stepLinkNav {
    position: fixed;
    top: 50%; right: 0;
    transform: translateY(-50%);
    z-index: 900;
    opacity: 0;
    transition: .4s ease-in-out;
    pointer-events: none;
}
.stepLinkNav.-in { opacity: 1; pointer-events: auto; }
.stepLinkNav.is-hide { opacity: 0; pointer-events: none; }
@media screen and (max-width: 768px) { .stepLinkNav { display: none; } }
.stepLinkNav .linkList { padding: 18px 22px 18px 18px; }
.stepLinkNav .item + .item { margin-top: 14px; }
.stepLinkNav .link {
    display: block;
    color: #9aa8c4;
    font-size: 13px;
    letter-spacing: 1.4px;
    text-decoration: none;
    transition: .3s ease-in-out;
}
.stepLinkNav .item.is-current .link { color: var(--c-blue); transform: translateX(-4px); }
.stepLinkNav .link:hover { color: var(--c-blue); }
.stepLinkNav .balloon {
    position: absolute; top: 0; right: 74px;
    display: flex; align-items: center;
    padding: 6px 15px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 2px 12px rgba(10, 42, 140, .12);
    opacity: 0;
    transition: .3s ease-in-out;
    white-space: nowrap;
}
.stepLinkNav .balloon.is-show { opacity: 1; }
.stepLinkNav .balloon .text { color: var(--c-blue); font-size: 12px; letter-spacing: 1px; }
.stepLinkNav .balloon .arrow { position: absolute; right: -8px; top: 50%; margin-top: -7px; }
.stepLinkNav .icon {
    display: block;
    width: 31px; margin: 0 auto;
    padding-bottom: 18px;
}
.stepLinkNav .icon svg { width: 100%; height: auto; }

/* ---------- footer ---------- */
.footerArea { position: relative; padding-bottom: 46px; background: #f2f6fd; }
.footerArea .circleImg { line-height: 0; margin-bottom: 2.7777777778vw; }
.footerArea .circleImg svg { width: 100%; height: 8.3333333333vw; }
@media screen and (min-width: 1441px) { .footerArea .circleImg svg { height: 120px; } .footerArea .circleImg { margin-bottom: 40px; } }
@media screen and (max-width: 768px) { .footerArea .circleImg svg { height: 56px; } }
.footerArea .contents {
    display: flex; align-items: center; justify-content: space-between;
    max-width: 83.3333333333vw; margin: auto;
}
@media screen and (min-width: 1441px) { .footerArea .contents { max-width: 1200px; } }
@media screen and (max-width: 768px) { .footerArea .contents { display: block; max-width: none; margin: 0 20px; text-align: center; } }
.footerArea .topBtn { display: flex; align-items: center; gap: 0 8px; color: var(--c-blue); text-decoration: none; font-size: 13px; letter-spacing: 1.2px; transition: .3s ease-in-out; }
.footerArea .topBtn:hover { opacity: .65; }
.footerArea .topBtn .arrow { display: block; width: 14px; }
.footerArea .topBtn .arrow svg { width: 14px; height: 9px; }
.footerArea .topBtn .arrow svg + svg { margin-top: -3px; opacity: .45; }
@media screen and (max-width: 768px) { .footerArea .topBtn { justify-content: center; } }
.footerArea .logo img { max-width: 168px; width: 100%; margin: auto; }
@media screen and (max-width: 768px) { .footerArea .logo { margin: 26px 0; } }
.footerArea .link { display: flex; align-items: center; gap: 0 10px; color: var(--c-blue); text-decoration: none; font-size: 13px; letter-spacing: 1.2px; transition: .3s ease-in-out; }
.footerArea .link:hover { opacity: .65; }
@media screen and (max-width: 768px) { .footerArea .link { justify-content: center; } }
.footerArea .link .icon { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid var(--c-blue); border-radius: 100%; }
.footerArea .link .icon svg { width: 10px; height: 10px; }