/*------------------------------------------
設定
------------------------------------------*/

:root {
    /* サイト幅 */
    --site-width: 1275px;

    /* 余白 */
    --section-padding-y: 80px;
    --tb-section-padding-y: 80px;
    --sp-section-padding-y: 4rem;

    /* カラー */
    --color-red1: #fa000f;
    --color-red2: #c00;
    --color-white: #fff;
    --color-gray1: #f4f4f4;
    --color-gray2: #d9d9d9;
    --color-gray3: #b3b3b3;
    --color-gray4: #737373;
    --color-gray5: #4d4d4d;
    --color-gray6: #222;
    --color-black: #0c0c0c;
    --color-orange1: #fdc796;
    --color-orange2: #fa6900;
    --color-orange3: #c85400;
    --color-yellow1: #fdec96;
    --color-yellow2: #fad200;
    --color-yellow3: #967e00;
    --color-pink1: #fd96d4;
    --color-pink2: #fa00a5;
    --color-pink3: #96005a;
    --color-purple1: #d096fd;
    --color-purple2: #9b00fa;
    --color-purple3: #540096;
    --color-blue1: #96c5fd;
    --color-blue2: #0064fa;
    --color-blue3: #004596;
    --color-teal1: #96f0fd;
    --color-teal2: #00dcfa;
    --color-teal3: #008496;
    --color-green1: #96fdcc;
    --color-green2: #00fa82;
    --color-green3: #00964e;
    --color-red1-tint1: #ffcbce;
    --color-red1-tint2: #ff979d;
    --color-red1-tint3: #ff636c;
    --color-red1-dark1: #bb000b;
    --color-red1-dark2: #7d0008;
}

/*------------------------------------------
リセット関連
------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
.JS h1,
.JS h2,
.JS h3,
.JS h4,
.JS h5 {
    margin: 0;
    padding: 0;
    border: none;
    background: none;
}

div#Contents .GridSet {
    max-width: 1275px;
    margin: 0 auto;
}

#Contents h4 {
    margin: unset;
}

.GridSet .Grid1 .ImgOnlyStyle img {
    width: 100%;
    height: auto;
}

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

    .JS .Grid4,
    .JS .Grid3,
    .JS .Grid1 {
        padding: 0;
    }

    .JS .Grid1 {
        margin: 0;
    }
}

@media screen and (max-width: 767px) {
    .JS .Grid1 {
        border-top: none;
    }
}

@media screen and (min-width: 995px) and (max-width: 1304px) {
    .OptionWideRWD .Grid1 {
        padding-right: 25px;
    }
}

#fs_subpage h1 {
    background-color: var(--color-gray2);
}

#fs_subpage main .Grid3 h2::after {
    display: none;
}

@media screen and (max-width: 767px) {
    div#LowerNavigationFs {
        display: block;
    }
}

.HorizontalInnerLinks {
    margin: 0;
}

.PageTop {
    margin: 2rem 0 0;
}

/* ディスプレイサイズによって不要な余白がついていたので削除 */
@media screen and (min-width: 995px) and (max-width: 1304px) {

    .OptionWideRWD .Grid4,
    .OptionWideRWD .Grid3,
    .OptionWideRWD .Grid1 {
        padding: 0;
    }
}

/*------------------------------------------
基本設定
------------------------------------------*/

* {
    box-sizing: border-box;
}

#Contents {
    padding-bottom: 0;
}

section {
    padding: var(--section-padding-y) 0;
}

.half-padding {
    padding: calc(var(--section-padding-y) / 2) 0;
}

section .inner {
    padding: 0 15px;
}

.headding-block {
    margin-bottom: 40px;
}
.headding-block > h2 {
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.56;
}
.headding-block > p {
    margin-top: 40px;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5;
}
@media screen and (max-width: 767px) {
    .headding-block > h2 {
        font-size: 1.4rem;
    }
    .headding-block > p {
        font-size: 1rem;
    }
}

/* テキスト外部リンク */
a[target="_blank"]:not(:has(img)):not(.ot-cookie-policy-link):not(.button-white):not(.button-green):not(.button) {
    position: relative;
}

a[target="_blank"]:not(:has(img)):not(.ot-cookie-policy-link):not(.button-white):not(.button-green):not(.button)::after {
    content: "";
    position: relative;
    display: inline-block;
    bottom: -5px;
    right: 0;
    width: 18px;
    height: 18px;
    padding-left: 4px;
    background: url(/-/media/image/jp/r1/icon/icon_new_window_hd.gif) no-repeat center / contain;
}

.LinkListStyle1 li a[target="_blank"]:link,
.LinkListStyle2 li a[target="_blank"]:link,
.LinkListStyle3 li a[target="_blank"]:link,
.LinkListStyle4 li a[target="_blank"]:link,
.LinkListStyle5 li a[target="_blank"]:link,
.LinkListStyle6 li a[target="_blank"]:link,
.LinkListStyle1 dt a[target="_blank"]:link,
.LinkListStyle2 dt a[target="_blank"]:link,
.LinkListStyle1 li a[target="_blank"]:visited,
.LinkListStyle2 li a[target="_blank"]:visited,
.LinkListStyle3 li a[target="_blank"]:visited,
.LinkListStyle4 li a[target="_blank"]:visited,
.LinkListStyle5 li a[target="_blank"]:visited,
.LinkListStyle6 li a[target="_blank"]:visited,
.LinkListStyle1 dt a[target="_blank"]:visited,
.LinkListStyle2 dt a[target="_blank"]:visited,
h3 a[target="_blank"]:link,
h3 a[target="_blank"]:visited {
    background: none;
}

/* ページ内のブロック間隔 */
.mt-interval {
    margin-top: 3rem !important;
}

@media screen and (max-width: 767px) {
    .mt-interval {
        margin-top: 2rem !important;
    }
}

/* 幅が小さめ（以前2カラムだったページ用） */
.small-inner {
    max-width: 965px;
    margin: 0 auto;
}

/*------------------------------------------
ユーティリティっぽいもの
------------------------------------------*/

/* color */
.color-red1 { color: var(--color-red1) !important }
.color-red2 { color: var(--color-red2) !important }
.color-white { color: var(--color-white) !important }
.color-gray1 { color: var(--color-gray1) !important }
.color-gray2 { color: var(--color-gray2) !important }
.color-gray3 { color: var(--color-gray3) !important }
.color-gray4 { color: var(--color-gray4) !important }
.color-gray5 { color: var(--color-gray5) !important }
.color-gray6 { color: var(--color-gray6) !important }
.color-black { color: var(--color-black) !important }
.color-orange1 { color: var(--color-orange1) !important }
.color-orange2 { color: var(--color-orange2) !important }
.color-orange3 { color: var(--color-orange3) !important }
.color-yellow1 { color: var(--color-yellow1) !important }
.color-yellow2 { color: var(--color-yellow2) !important }
.color-yellow3 { color: var(--color-yellow3) !important }
.color-pink1 { color: var(--color-pink1) !important }
.color-pink2 { color: var(--color-pink2) !important }
.color-pink3 { color: var(--color-pink3) !important }
.color-purple1 { color: var(--color-purple1) !important }
.color-purple2 { color: var(--color-purple2) !important }
.color-purple3 { color: var(--color-purple3) !important }
.color-blue1 { color: var(--color-blue1) !important }
.color-blue2 { color: var(--color-blue2) !important }
.color-blue3 { color: var(--color-blue3) !important }
.color-teal1 { color: var(--color-teal1) !important }
.color-teal2 { color: var(--color-teal2) !important }
.color-teal3 { color: var(--color-teal3) !important }
.color-green1 { color: var(--color-green1) !important }
.color-green2 { color: var(--color-green2) !important }
.color-green3 { color: var(--color-green3) !important }
.color-red1-tint1 { color: var(--color-red1-tint1) !important }
.color-red1-tint2 { color: var(--color-red1-tint2) !important }
.color-red1-tint3 { color: var(--color-red1-tint3) !important }
.color-red1-dark1 { color: var(--color-red1-dark1) !important }
.color-red1-dark2 { color: var(--color-red1-dark2) !important }

/* width */
.w-10 { width: 10px !important }
.w-20 { width: 20px !important }
.w-30 { width: 30px !important }
.w-40 { width: 40px !important }
.w-50 { width: 50px !important }
.w-60 { width: 60px !important }
.w-70 { width: 70px !important }
.w-80 { width: 80px !important }
.w-90 { width: 90px !important }
.w-100 { width: 100px !important }
.w-110 { width: 110px !important }
.w-120 { width: 120px !important }
.w-130 { width: 130px !important }
.w-140 { width: 140px !important }
.w-150 { width: 150px !important }
.w-160 { width: 160px !important }
.w-170 { width: 170px !important }
.w-180 { width: 180px !important }
.w-190 { width: 190px !important }
.w-200 { width: 200px !important }
.w-210 { width: 210px !important }
.w-220 { width: 220px !important }
.w-230 { width: 230px !important }
.w-240 { width: 240px !important }
.w-250 { width: 250px !important }
.w-260 { width: 260px !important }
.w-270 { width: 270px !important }
.w-280 { width: 280px !important }
.w-290 { width: 290px !important }
.w-300 { width: 300px !important }
.w-310 { width: 310px !important }
.w-320 { width: 320px !important }
.w-330 { width: 330px !important }
.w-340 { width: 340px !important }
.w-350 { width: 350px !important }
.w-360 { width: 360px !important }
.w-370 { width: 370px !important }
.w-380 { width: 380px !important }
.w-390 { width: 390px !important }
.w-400 { width: 400px !important }
.w-410 { width: 410px !important }
.w-420 { width: 420px !important }
.w-430 { width: 430px !important }
.w-440 { width: 440px !important }
.w-450 { width: 450px !important }
.w-460 { width: 460px !important }
.w-470 { width: 470px !important }
.w-480 { width: 480px !important }
.w-490 { width: 490px !important }
.w-500 { width: 500px !important }

/* max-width */
.mw-500 { max-width: 500px !important }
.mw-510 { max-width: 510px !important }
.mw-520 { max-width: 520px !important }
.mw-530 { max-width: 530px !important }
.mw-540 { max-width: 540px !important }
.mw-550 { max-width: 550px !important }
.mw-560 { max-width: 560px !important }
.mw-570 { max-width: 570px !important }
.mw-580 { max-width: 580px !important }
.mw-590 { max-width: 590px !important }
.mw-600 { max-width: 600px !important }
.mw-610 { max-width: 610px !important }
.mw-620 { max-width: 620px !important }
.mw-630 { max-width: 630px !important }
.mw-640 { max-width: 640px !important }
.mw-650 { max-width: 650px !important }
.mw-660 { max-width: 660px !important }
.mw-670 { max-width: 670px !important }
.mw-680 { max-width: 680px !important }
.mw-690 { max-width: 690px !important }
.mw-700 { max-width: 700px !important }
.mw-710 { max-width: 710px !important }
.mw-720 { max-width: 720px !important }
.mw-730 { max-width: 730px !important }
.mw-740 { max-width: 740px !important }
.mw-750 { max-width: 750px !important }
.mw-760 { max-width: 760px !important }
.mw-770 { max-width: 770px !important }
.mw-780 { max-width: 780px !important }
.mw-790 { max-width: 790px !important }
.mw-800 { max-width: 800px !important }

/* margin */
.m-auto { margin: 0 auto !important; }
.m-0 { margin: 0px !important; }
.m-1 { margin: 1px !important; }
.m-2 { margin: 2px !important; }
.m-3 { margin: 3px !important; }
.m-4 { margin: 4px !important; }
.m-5 { margin: 5px !important; }
.m-6 { margin: 6px !important; }
.m-7 { margin: 7px !important; }
.m-8 { margin: 8px !important; }
.m-9 { margin: 9px !important; }
.m-10 { margin: 10px !important; }
.m-20 { margin: 20px !important; }

/* margin-top */
.mt-0 { margin-top: 0px !important; }
.mt-1 { margin-top: 1px !important; }
.mt-2 { margin-top: 2px !important; }
.mt-3 { margin-top: 3px !important; }
.mt-4 { margin-top: 4px !important; }
.mt-5 { margin-top: 5px !important; }
.mt-6 { margin-top: 6px !important; }
.mt-7 { margin-top: 7px !important; }
.mt-8 { margin-top: 8px !important; }
.mt-9 { margin-top: 9px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }

/* margin-right */
.mr-0 { margin-right: 0px !important; }
.mr-1 { margin-right: 1px !important; }
.mr-2 { margin-right: 2px !important; }
.mr-3 { margin-right: 3px !important; }
.mr-4 { margin-right: 4px !important; }
.mr-5 { margin-right: 5px !important; }
.mr-6 { margin-right: 6px !important; }
.mr-7 { margin-right: 7px !important; }
.mr-8 { margin-right: 8px !important; }
.mr-9 { margin-right: 9px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-20 { margin-right: 20px !important; }

/* margin-bottom */
.mb-0 { margin-bottom: 0px !important; }
.mb-1 { margin-bottom: 1px !important; }
.mb-2 { margin-bottom: 2px !important; }
.mb-3 { margin-bottom: 3px !important; }
.mb-4 { margin-bottom: 4px !important; }
.mb-5 { margin-bottom: 5px !important; }
.mb-6 { margin-bottom: 6px !important; }
.mb-7 { margin-bottom: 7px !important; }
.mb-8 { margin-bottom: 8px !important; }
.mb-9 { margin-bottom: 9px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }

/* margin-left */
.ml-0 { margin-left: 0px !important; }
.ml-1 { margin-left: 1px !important; }
.ml-2 { margin-left: 2px !important; }
.ml-3 { margin-left: 3px !important; }
.ml-4 { margin-left: 4px !important; }
.ml-5 { margin-left: 5px !important; }
.ml-6 { margin-left: 6px !important; }
.ml-7 { margin-left: 7px !important; }
.ml-8 { margin-left: 8px !important; }
.ml-9 { margin-left: 9px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-20 { margin-left: 20px !important; }

/* padding */
.p-0 { padding: 0px !important; }
.p-1 { padding: 1px !important; }
.p-2 { padding: 2px !important; }
.p-3 { padding: 3px !important; }
.p-4 { padding: 4px !important; }
.p-5 { padding: 5px !important; }
.p-6 { padding: 6px !important; }
.p-7 { padding: 7px !important; }
.p-8 { padding: 8px !important; }
.p-9 { padding: 9px !important; }
.p-10 { padding: 10px !important; }
.p-20 { padding: 20px !important; }
.p-30 { padding: 30px !important; }
.p-40 { padding: 40px !important; }
.p-50 { padding: 50px !important; }

/* padding-top */
.pt-0 { padding-top: 0px !important; }
.pt-1 { padding-top: 1px !important; }
.pt-2 { padding-top: 2px !important; }
.pt-3 { padding-top: 3px !important; }
.pt-4 { padding-top: 4px !important; }
.pt-5 { padding-top: 5px !important; }
.pt-6 { padding-top: 6px !important; }
.pt-7 { padding-top: 7px !important; }
.pt-8 { padding-top: 8px !important; }
.pt-9 { padding-top: 9px !important; }
.pt-10 { padding-top: 10px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }

/* padding-right */
.pr-0 { padding-right: 0px !important; }
.pr-1 { padding-right: 1px !important; }
.pr-2 { padding-right: 2px !important; }
.pr-3 { padding-right: 3px !important; }
.pr-4 { padding-right: 4px !important; }
.pr-5 { padding-right: 5px !important; }
.pr-6 { padding-right: 6px !important; }
.pr-7 { padding-right: 7px !important; }
.pr-8 { padding-right: 8px !important; }
.pr-9 { padding-right: 9px !important; }
.pr-10 { padding-right: 10px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }
.pr-50 { padding-right: 50px !important; }

/* padding-bottom */
.pb-0 { padding-bottom: 0px !important; }
.pb-1 { padding-bottom: 1px !important; }
.pb-2 { padding-bottom: 2px !important; }
.pb-3 { padding-bottom: 3px !important; }
.pb-4 { padding-bottom: 4px !important; }
.pb-5 { padding-bottom: 5px !important; }
.pb-6 { padding-bottom: 6px !important; }
.pb-7 { padding-bottom: 7px !important; }
.pb-8 { padding-bottom: 8px !important; }
.pb-9 { padding-bottom: 9px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }
.pb-50 { padding-bottom: 50px !important; }

/* padding-left */
.pl-0 { padding-left: 0px !important; }
.pl-1 { padding-left: 1px !important; }
.pl-2 { padding-left: 2px !important; }
.pl-3 { padding-left: 3px !important; }
.pl-4 { padding-left: 4px !important; }
.pl-5 { padding-left: 5px !important; }
.pl-6 { padding-left: 6px !important; }
.pl-7 { padding-left: 7px !important; }
.pl-8 { padding-left: 8px !important; }
.pl-9 { padding-left: 9px !important; }
.pl-10 { padding-left: 10px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }
.pl-50 { padding-left: 50px !important; }

/* background-color */
.bg-gray1 { background-color: var(--color-gray1) !important; }
.bg-gray2 { background-color: var(--color-gray2) !important; }
.bg-gray3 { background-color: var(--color-gray3) !important; }
.bg-gray4 { background-color: var(--color-gray4) !important; }
.bg-gray5 { background-color: var(--color-gray5) !important; }
.bg-gray6 { background-color: var(--color-gray6) !important; }

/* flex */
.flex { display: flex !important; }
.item-center { align-items: center !important; }
.item-top { align-items: top !important; }
.justify-center { justify-content: center !important; }
.justify-left { justify-content: left !important; }
.direction-column { flex-direction: column !important; }
.direction-column-reverse { flex-direction: column-reverse !important; }
.wrap { flex-wrap: wrap !important; }
.gap-0 { gap: 0 !important; }
.gap-10 { gap: 10px !important; }
.gap-20 { gap: 20px !important; }
.gap-30 { gap: 30px !important; }
.gap-40 { gap: 40px !important; }
.gap-50 { gap: 50px !important; }
.row-gap-0 { row-gap: 0 !important; }
.row-gap-10 { row-gap: 10px !important; }
.row-gap-20 { row-gap: 20px !important; }
.row-gap-30 { row-gap: 30px !important; }
.row-gap-40 { row-gap: 40px !important; }
.row-gap-50 { row-gap: 50px !important; }

/* grid */
.grid { display: grid !important; }
.grid-cols-1 { grid-template-columns: 1fr !important; }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr) !important; }
.grid-cols-3 { grid-template-columns: repeat(3, 1fr) !important; }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr) !important; }
.grid-cols-5 { grid-template-columns: repeat(5, 1fr) !important; }

@media screen and (max-width: 767px) {
    .sp-grid-cols-1 { grid-template-columns: 1fr !important; }
    .sp-grid-cols-2 { grid-template-columns: repeat(2, 1fr) !important; }
    .sp-grid-cols-3 { grid-template-columns: repeat(3, 1fr) !important; }
    .sp-grid-cols-4 { grid-template-columns: repeat(4, 1fr) !important; }
    .sp-grid-cols-5 { grid-template-columns: repeat(5, 1fr) !important; }
}

/* font-size */
.fs-10 { font-size: 10px !important; }
.fs-12 { font-size: 12px !important; }
.fs-14 { font-size: 14px !important; }
.fs-16 { font-size: 16px !important; }
.fs-18 { font-size: 18px !important; }
.fs-20 { font-size: 20px !important; }
.fs-24 { font-size: 24px !important; }
.fs-28 { font-size: 28px !important; }

@media screen and (max-width: 767px) {
    .sp-fs-10 { font-size: 10px !important; }
    .sp-fs-12 { font-size: 12px !important; }
    .sp-fs-14 { font-size: 14px !important; }
    .sp-fs-16 { font-size: 16px !important; }
    .sp-fs-18 { font-size: 18px !important; }
    .sp-fs-20 { font-size: 20px !important; }
    .sp-fs-24 { font-size: 24px !important; }
    .sp-fs-28 { font-size: 28px !important; }
}

.text-normal { font-weight: 400 !important; }
.text-bold { font-weight: 700 !important; }
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }


/* pc-only */
@media screen and (max-width: 767px) {
    .pc-only { display: none; }
}

/* sp-only */
.sp-only { display: none; }

@media screen and (max-width: 767px) {
    .sp-only { display: unset; }
}

/* 画面幅100% */
.full-width {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
}

/*------------------------------------------
埋め込みパーツ
------------------------------------------*/

/* CTA */
.cta {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    padding: 60px 0;
    background: #fdec96;
}
.cta .inner {
    padding: 0 15px;
}
.cta .inner > h2 {
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.6;
}
.cta .inner .button-box {
    margin-top: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}
@media screen and (max-width: 767px) {
    .cta .inner .button-box {
        flex-direction: column;
        gap: 1rem;
    }
    .cta .inner > h2 {
        font-size: 1.2rem;
    }
}


/* 障がい者支援事業者向けサービス　システム一覧 */
.system-list .content-block > ul {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 30px;
}
.system-list .content-block > ul > li > a {
    padding: 5px 10px 5px 5px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    height: 110px;
    border-radius: 8px;
    background: #116036;
    box-shadow: 0 6px 0 0 rgba(0, 0, 0, 0.30);
    color: var(--color-white);
    text-decoration: none;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.11;
    cursor: pointer;
    transition: all .3s;
}
.system-list .content-block > ul > li > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%) rotate(45deg);
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}
.system-list .content-block > ul > li > a.small {
    font-size: 14px;
}
.system-list .content-block > ul > li > a.disabled {
    background: #b8d0c3;
    cursor: none;
}
.system-list .content-block > ul > li > a.disabled::before {
    content: "coming soon";
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    color: #d6eadf;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 2.22;
}
.system-list .content-block > ul > li > a:hover:not(a.disabled) {
    position: relative;
    top: -2px;
}
@media screen and (max-width: 767px) {
    .system-list .inner {
        padding: 0;
    }
    .system-list .content-block > ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .system-list .content-block > ul > li > a {
        padding-right: 1rem;
        width: 100%;
        font-size: 1rem;
    }
    .system-list .content-block > ul > li > a.small {
        font-size: .7rem;
    }
    .system-list .content-block > ul > li > a::after {
        right: .5rem;
        width: .3rem;
        height: .3rem;
    }
    .system-list .content-block > ul > li > a.disabled::before {
        font-size: .8rem;
    }
}

/* 現行製品をお使いの方は、こちらをご覧ください */
.current-user-info {
    padding-top: 0;
    background: transparent;
}
.current-user-info .content-block .button-box {
    display: flex;
    justify-content: center;
    align-items: center;
}
.current-user-info .content-block .button-box .button-white {
    width: 700px;
    height: 82px;
    border-radius: 8px;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.66;
}

@media screen and (max-width: 767px) {
    .current-user-info .content-block .button-box .button-white {
        width: 100%;
        font-size: 1.2rem;
    }
}


/* サポート情報 */
.support-info {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: var(--color-gray1);
}
.support-info .inner {
    padding: 0 15px;
}
.support-info .content-block .link-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
}
.support-info .content-block .link-box .button-white {
    width: 380px;
    height: 82px;
    border-radius: 8px;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.66;
}
.support-info .content-block > h3 {
    margin-top: 80px;
    color: var(--color-black);
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.56;
}
.support-info .content-block .cta-box {
    max-width: 908px;
    margin: 130px auto 0;
    padding: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border-radius: 10px;
    background: #fafae6;
    box-shadow: 0 0 8px 0 #c0c0c0;
    position: relative;
}
.support-info .content-block .cta-box::before {
    content: "";
    position: absolute;
    top: -95px;
    left: 50%;
    transform: translateX(-50%);
    width: 216px;
    height: 116px;
    background: url(/-/media/ind/fukushinomori/kaigo/futurebetkanri/image/chara.png) no-repeat center / contain;
}
.support-info .content-block .cta-box .button {
    position: relative;
    width: 407px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 7px;
    color: var(--color-white);
    text-decoration: none;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 3.75;
}
.support-info .content-block .cta-box .button:hover {
    opacity: .8;
}
.support-info .content-block .cta-box .button.mail {
    background: #3d8000 url(/-/media/ind/fukushinomori/kaigo/futurebetkanri/image/ico_contact.png) no-repeat 20px center / 40px 30px;
}
.support-info .content-block .cta-box .button.doc {
    background: #3d8000 url(/-/media/ind/fukushinomori/kaigo/futurebetkanri/image/ico_document.png) no-repeat 60px center / 35px 39px;
}
@media screen and (max-width: 767px) {
    .support-info .content-block .link-box {
        flex-wrap: wrap;
    }
    .support-info .content-block .cta-box {
        flex-wrap: wrap;
    }
    .support-info .content-block .link-box .button-white {
        font-size: 1.2rem;
    }
    .support-info .content-block > h3 {
        font-size: 1.6rem;
    }
    .support-info .content-block .cta-box .button {
        font-size: 1rem;
    }
    .support-info .content-block .cta-box .button.doc {
        background-size: 26px 30px;
    }
    .support-info .content-block .cta-box .button.mail {
        background-size: 28px 20px;
    }
}

/*------------------------------------------
共通パーツ
------------------------------------------*/

/* fv */
.fv {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    padding: 60px 0;
}
.fv .inner {
    padding: 0 15px;
    max-width: calc(1100px + calc(15px * 2));
    margin: 0 auto;
}
.fv .service-title {
    text-align: center;
    margin-bottom: 40px;
}
.fv .service-title > p {
    display: inline-block;
    padding: 0 45px;
    position: relative;
    color: #116036;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1.6px;
}
.fv .service-title > p::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 1px;
    background: #116036;
}
.fv .service-title > p::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 1px;
    background: #116036;
}
.fv .text-image-block {
    display: flex;
    justify-content: center;
    gap: 60px;
}
.fv .text-image-block .text-box > h1 {
    display: inline-block;
    padding: 6px 16px;
    background: #116036;
    color: var(--color-white);
    font-size: 42px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.19;
}
.fv .text-image-block .text-box > h2 {
    margin-top: 32px;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.25;
}
.fv .text-image-block .text-box .description {
    margin-top: 32px;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.66;
}
.fv .text-image-block .image-box {
    max-width: 550px;
}
/* billingだけ少し異なる */
 .fv.billing .text-image-block .image-box {
    max-width: 443px;
}
@media screen and (max-width: 994px) {
    .fv .text-image-block {
        flex-direction: column;
        gap: 1rem;
    }
    .fv .text-image-block .text-box {
        width: 550px;
        margin: 0 auto;
    }
}
@media screen and (max-width: 767px) {
    .fv .service-title > p {
        padding: 0 1rem;
        font-size: 1.1rem;
    }
    .fv .service-title > p::before,
    .fv .service-title > p::after {
        width: .7rem;
    }
    .fv .text-image-block .text-box {
        width: 100%;
    }
    .fv .text-image-block .text-box > h1 {
        padding: 10px;
        font-size: 1.8rem;
    }
    .fv.billing .text-image-block .text-box > h1 {
        padding: 10px;
        font-size: 1.5rem;
    }
    .fv .text-image-block .text-box > h2 {
        font-size: 1.6rem;
    }
    .fv .text-image-block .text-box .description {
        font-size: 1rem;
    }
}


/* ボタン（緑枠 + 背景白） */
a.button-white {
    width: 270px;
    height: 50px;
    padding-right: 20px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border: 1px solid #116036;
    border-radius: 200px;
    position: relative;
    transition: all .3s;

    color: #116036;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.11;
}

a.button-white::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    border-top: 2px solid #116036;
    border-right: 2px solid #116036;
}

a.button-white:hover {
    background: #116036;
    color: #fff;
}

a.button-white:hover::after {
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}

/* ボタン（緑枠 + 背景白） */
a.button-green {
    width: 270px;
    height: 50px;
    padding-right: 20px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #116036;
    border: 1px solid #116036;
    border-radius: 200px;
    position: relative;
    transition: all .3s;

    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.11;
}

a.button-green::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}

a.button-green:hover {
    background: #fff;
    color: #116036;
}

a.button-green:hover::after {
    border-top: 2px solid #116036;
    border-right: 2px solid #116036;
}


/* 画像 */
.image-box {
    width: fit-content;
    margin: 0 auto;
}

.image-box img {
    margin: 0 auto;
    display: block;
    max-width: 100%;
    height: auto;
}

.image-box .caption {
    font-size: 12px;
    color: var(--color-black);
}

/* 普通のテーブル */
table.normal {
    width: 100%;
}

table.normal th {
    padding: 20px;
    border: solid 1px #ccc;
    color: #000;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 0;
    text-align: left;
    white-space: nowrap;
}

table.normal td {
    padding: 20px;
    border: solid 1px #ccc;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0;
    text-align: left;
}

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

    table.normal th,
    table.normal td {
        padding: 0.5rem;
        font-size: .9rem;
    }
}

/* table（枠なし） */
table.no-border th,
table.no-border td {
    border: none !important;
}

/* 2列グリッド */
.grid-two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

@media screen and (max-width: 767px) {
    .grid-two-column {
        grid-template-columns: 1fr;
    }
}

/* 枠線つきのボックス */
.border-box {
    padding: 20px 30px;
    border: 1px solid var(--color-gray2);
}

.border-box .title {
    color: var(--color-black);
    font-size: 20px;
    font-weight: 700;
}

.border-box .content {
    margin-top: 20px;
}

@media screen and (max-width: 767px) {
    .border-box {
        padding: 1rem;
    }
}

/* flex テキスト+画像 */
.flex-box-image {
    display: flex;
    gap: 20px;
}

.flex-box-image .image-box {
    width: unset;
    flex-shrink: 0;
}

.flex-box-image .image-box img {
    flex-shrink: 0;
}

@media (max-width: 994px) {
    .flex-box-image {
        flex-direction: column;
        gap: 1rem;
    }

    .flex-box-image img {
        margin: 0 auto;
    }
}

/* 注意書き */
p.note {
    padding-left: 20px;
    position: relative;
}

p.note::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
}

/* 脚注 */
ul.footnote {
    margin: 0;
    padding: 0;
}

ul.footnote>li {
    padding-left: 1rem;
    position: relative;
    font-size: .8rem;
}

ul.footnote>li::before {
    content: "※";
    position: absolute;
    top: 1px;
    left: 0;
    font-size: .8rem;
    line-height: 1.4;
}


/*------------------------------------------
障がい者事業者向けサービスTOP
------------------------------------------*/

/* main-visual */
.top .main-visual {
    padding: 40px 0 0;
}
.top .main-visual .service-title {
    text-align: center;
    margin-bottom: 40px;
}
.top .main-visual .service-title > p {
    display: inline-block;
    padding: 0 45px;
    position: relative;
    color: #116036;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1.6px;
}
.top .main-visual .service-title > p::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 1px;
    background: #116036;
}
.top .main-visual .service-title > p::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 1px;
    background: #116036;
}
.top .main-visual .content {
    display: grid;
    grid-template-columns: 1fr 2.2fr;
    align-items: center;
    gap: 20px;
}
.top .main-visual .content .problem-box {
    padding: 40px 0 50px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    row-gap: 60px;
    background: url(/-/media/ind/fukushinomori/image/shogai_service/top/main_visual_bg.png) no-repeat center / cover;
}
.top .main-visual .content .problem-box .item {
    display: flex;
    gap: 10px;
}
.top .main-visual .content .problem-box .item .image-box {
    max-width: 140px;
}
.top .main-visual .content .problem-box .item .text-box {
    margin-left: 20px;
    width: 205px;
    position: relative;
    border-radius: 10px;
    background: #FDEC96;
    filter: drop-shadow(0 6px 0 rgba(0, 0, 0, 0.30));
}
.top .main-visual .content .problem-box .item .text-box::before {
    content: "";
    position: absolute;
    top: 60px;
    left: -20px;
    width: 23px;
    height: 39px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='39' viewBox='0 0 23 39' fill='none'%3E%3Cpath d='M0 0.00017364L23 38.1051L23 2.74272e-07L0 0.00017364Z' fill='%23FDEC96'/%3E%3C/svg%3E") no-repeat center / contain;
}
.top .main-visual .content .problem-box .item .text-box .title {
    margin: 3px 3px 0;
    background: #fff;
    border-radius: 10px 10px 0 0;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 2.14;
}
.top .main-visual .content .problem-box .item .text-box .text {
    margin: 25px 0;
    color: #116036;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.25;
}
.top .main-visual .content .problem-box .item .text-box .button-green {
    width: 191px;
    height: 46px;
    margin: 0 auto 13px;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.33;
}
.top .main-visual .content .problem-box .item .text-box .button-green::after {
    right: 20px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transition: all .3s;
}
.top .main-visual .content .problem-box .item .text-box .button-green:hover::after {
    border-top: 1px solid #116036;
    border-right: 1px solid #116036;
}
.top .main-visual .content .problem-box .item .text-box .button-green.disabled {
    cursor: default;
}
.top .main-visual .content .problem-box .item .text-box .button-green.disabled:hover {
    background: #116036;
    color: #fff;
}
.top .main-visual .content .problem-box .item .text-box .button-green.disabled:hover::after {
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}

.top .main-visual .content .problem-box .item.reverse {
    flex-flow: row-reverse;
}
.top .main-visual .content .problem-box .item.reverse .text-box {
    margin-left: unset;
    margin-right: 20px;
}
.top .main-visual .content .problem-box .item.reverse .text-box::before {
    left: unset;
    right: -20px;
    transform: scaleX(-1);
}
@media screen and (max-width: 1200px) {
    .top .main-visual .content {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .top .main-visual .content .image-box {
        max-width: 382px;
    }
    .top .main-visual .content .problem-box {
        width: 100vw;
        margin-left: calc(-50vw + 50%);
        padding: 2rem 15px;
        justify-content: center;
    }
}
@media screen and (max-width: 767px) {
    .top .main-visual .service-title > p {
        padding: 0 1rem;
        font-size: 1.1rem;
    }
    .top .main-visual .service-title > p::before,
    .top .main-visual .service-title > p::after {
        width: .7rem;
    }
}

/* service */
.top .service {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: #ecefe4;
}
.top .service .content-block > ul {
    max-width: 1245px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 35px;
}
.top .service .content-block > ul > li > a {
    display: block;
    width: 270px;
    height: 260px;
    padding: 37.5px 5px 20px;
    border-radius: 16px;
    border: 2px solid #116036;
    background: #fff;
    box-shadow: 0 6px 0 0 rgba(0, 0, 0, 0.30);
    text-decoration: none;
    transition: all .3s;
}
.top .service .content-block > ul > li > a.disabled {
    cursor: default;
    opacity: .4;
}
.top .service .content-block > ul > li > a:not(.disabled):hover {
    background: #d3ecde;
}
.top .service .content-block > ul > li > a.disabled:hover img {
    opacity: 1!important;
}
.top .service .content-block > ul > li > a .image-box {
    max-width: 80px;
    height: 80px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.top .service .content-block > ul > li > a > h3 {
    margin-top: 20px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #116036;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}
.top .service .content-block > ul > li > a .link-box {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.top .service .content-block > ul > li > a .link-box .link {
    padding-right: 35px;
    position: relative;
    color: #116036;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 2.22;
}
.top .service .content-block > ul > li > a .link-box .link::after {
    content: "";
    position: absolute;
    top: calc(50% - 2px);
    right: 0;
    transform: translateY(-50%);
    width: 31px;
    height: 31px;
    background: url(/-/media/ind/fukushinomori/image/shogai_service/top/service_arrow.png) no-repeat center / contain;
}
@media screen and (max-width: 1214px) {
    .top .service .content-block > ul {
        justify-content: center;
    }
}
@media screen and (max-width: 767px) {
    .top .service .content-block > ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .top .service .content-block > ul > li > a {
        padding: 1rem .5rem;
        width: unset;
        height: unset;
    }
    .top .service .content-block > ul > li > a .image-box {
        max-width: 70px;
        height: 70px;
    }
    .top .service .content-block > ul > li > a > h3 {
        margin-top: 0;
        font-size: .75rem;
    }
    .top .service .content-block > ul > li > a .link-box {
        margin-top: 0;
    }
    .top .service .content-block > ul > li > a .link-box .link {
        font-size: .8rem;
    }
    .top .service .content-block > ul > li > a .link-box .link::after {
        width: 20px;
        height: 20px;
        top: 50%;
    }
}

/* info */
.top .info .content-block > h3 {
    color: #0c0c0c;
    margin-bottom: 2rem;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.66;
}
.top .info .content-block .video-box {
    margin-bottom: 4rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.top .info .content-block .news-list {
    max-width: 800px;
    margin: 0 auto;
}
.top .info .content-block .news-list > li {
    padding: 1rem 0;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 28px;
    text-decoration: none;
    border-bottom: 1px solid #b3b3b3;
}
.top .info .content-block .news-list > li:last-child {
    border-bottom: none;
}
.top .info .content-block .news-list > li .date {
    width: 90px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    border: 1px solid #116036;
    background: #fff;
    color: #116036;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 2.14;
}
.top .info .content-block .news-list > li .title {
    padding-right: 20px;
    position: relative;
    color: #116036;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.66;
}
@media screen and (max-width: 767px) {
    .top .info .content-block .news-list > li {
        grid-template-columns: 1fr;
        gap: .5rem;
    }
}

/* renewal */
.top .renewal {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: #ecefe4;
}
.top .renewal .inner {
    max-width: 1100px;
    margin: 0 auto;
}
.top .renewal .content-block .card-list {
    max-width: 800px;
    margin: 60px auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 45px;
}
.top .renewal .content-block .card-list .card {
    padding: 32px 24px;
    border-radius: 16px;
    background: #fff;
}
.top .renewal .content-block .card-list .card > h3 {
    margin-bottom: 16px;
    color: #116036;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
}
.top .renewal .content-block .card-list .card > hr {
    margin-bottom: 16px;
    height: 1px!important;
    display: block;
    border-top: 1px solid #b3b3b3;
}
.top .renewal .content-block .card-list .card .tags {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
.top .renewal .content-block .card-list .card .tags > li {
    padding: 8px 10px;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.54;
    border-radius: 8px;
    border: 1px solid #0c0c0c;
}
.top .renewal .content-block .card-list .card .image-box {
    margin-bottom: 16px;
}
.top .renewal .content-block .card-list .card > p {
    margin-bottom: 16px;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 1.08px;
}
.top .renewal .content-block .card-list .card .note {
    display: grid;
    grid-template-columns: 1fr;
    gap: .5rem;
}
.top .renewal .content-block .card-list .card .note > li {
    position: relative;
    padding-left: 16px;
    color: #666;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.42;
    letter-spacing: 0.7px;
}
.top .renewal .content-block .card-list .card .note > li::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 14px;
}
@media screen and (max-width: 767px) {
    .top .renewal .content-block .card-list {
        grid-template-columns: 1fr;
    }
    .top .renewal .content-block .card-list .card .tags > li {
        font-size: .8rem;
    }
}

.top .renewal .current-user-info {
    padding-bottom: 0;
}

/*------------------------------------------
下層ページ
------------------------------------------*/

/* about */
.about {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: #ecefe4;
}
.about .inner {
    padding: 0 15px;
}
.about .content-block .image-box {
    max-width: 1100px;
}


/* feature */
.feature .content-block > ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: baseline;
}
.feature .content-block > ul > li {
    padding: 35px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
.feature .content-block > ul > li:not(li:first-child) {
    border-left: 1px solid var(--color-gray3);
}
.feature .content-block > ul > li .image-box {
    max-width: 64px;
}
.feature .content-block > ul > li > h3 {
    color: #116036;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
}
.feature .content-block > ul > li > p {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.6;
}
@media screen and (max-width: 767px) {
    .feature .content-block > ul {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .feature .content-block > ul > li:not(li:first-child) {
        border: none;
    }
    .feature .content-block > ul > li > h3 {
        font-size: 1.2rem;
    }
    .feature .content-block > ul > li > p {
        font-size: 1rem;
    }
}


/* problem */
.problem {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    background: #ecefe4;
}
.problem .inner {
    padding: 0 15px;
}
.problem .content-block > ul {
    display: flex;
    justify-content: center;
    align-items: center;
}
.problem .content-block > ul > li {
    padding: 35px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
.problem .content-block > ul > li:not(li:first-child) {
    border-left: 1px solid var(--color-gray3);
}
.problem .content-block > ul > li .image-box {
    max-width: 340px;
}

@media screen and (max-width: 767px) {
    .problem .content-block > ul {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .problem .content-block > ul > li:not(li:first-child) {
        border: none;
    }
}