@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

/*----------------------------------------
全体設定
------------------------------------------*/
html {
    overflow-y: scroll;
}

body {
    font-family: "Noto Sans", sans-serif;
    font-weight: normal;
    font-size: clamp(16px, 18/1280*100vw, 18px);
    letter-spacing: 0;
    line-height: calc(27/19);
    max-width: 100%;
    /* background-image: url(../images/);
    background-repeat: no-repeat; */
    overflow-x: hidden;
    overflow-y: hidden;
}

.barlow {
    font-family: "Barlow", sans-serif;
    font-weight: 500;
    font-style: normal;
}

*,
*:before,
*:after {
    box-sizing: border-box;
}

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

body,
a,
p,
ul li,
h1,
h2,
h3,
h4,
h5 {
    color: var(--black);
}

h1,
h2,
h3,
h4,
h5 {
    width: 100% !important;
}

a {
    text-decoration: none;
    font-size: clamp(16px, 18/1280*100vw, 18px);
}

a img {
    display: block;
}

p {
    font-size: clamp(16px, 18/1280*100vw, 18px);
    line-height: 1.8;
}

ul li {
    list-style: none;
}

h1 {
    font-size: clamp(27px, 30/1280*100vw, 30px);
    font-weight: bold;
    padding: 0.3em 0;
}

h2 {
    font-size: clamp(30px, 32/1280*100vw, 32px);
    font-weight: bold;
    padding: 0.3em 0;
}

h3 {
    font-size: clamp(21px, 24/1280*100vw, 24px);
    font-weight: bold;
    padding: 0.3em 0;
}

h4 {
    font-size: clamp(18px, 20/1280*100vw, 20px);
    font-weight: bold;
    color: var(--primary);
    padding: 0.3em 0;
}

h5 {
    font-size: clamp(30px, 36/1280*100vw, 36px);
    color: var(--white);
    font-weight: 600;
}

section {
    margin: 1.5em 0;
    padding: 2.5em 0;
}

.content_wrap {
    width: 100%;
    max-width: 1280px;
    padding: 0 min(80 / 1280* 100vw, 80px);
    overflow: hidden;
    margin: 0 auto;
}


@media screen and (max-width: 767px) {
    a {
        text-decoration: none;
        font-size: clamp(14px, 16/375*100vw, 16px);
    }

    p {
        font-size: clamp(14px, 16/375*100vw, 16px);
    }

    h1 {
        font-size: clamp(24px, 30/375*100vw, 30px);
        width: fit-content;
    }

    h2 {
        font-size: clamp(20px, 24/375*100vw, 24px);
        width: fit-content;
    }

    h3 {
        font-size: clamp(16px, 20/375*100vw, 20px);
        width: fit-content;
    }

    h5 {
        font-size: clamp(21px, 24/375*100vw, 24px);
    }

    .content_wrap {
        width: 100%;
        padding: 0 min(24 / 375* 100vw, 24px);
        overflow: hidden;
    }

}


/*----------------------------------------
クラス設定
------------------------------------------*/
:root {
    /* カラー（色） */
    --white: #ffffff;
    --gray: #CCCCCC;
    --black: #181A19;
    --primary: #2B5244;
    --secondary: #4DA484;
    --tertiary: #FAF5F1;
    --quanternary: #3C1F0A;
    --red: #C23E3E;
    --blue: #2B5BB4;
    --link: #15346D;
    /* タイポグラフィ（フォントサイズ） */
    --body: clamp(1.4rem, 0.8rem + 1.25vw, 1.6rem);
    /* 16-18px */
    --display: clamp(3.2rem, -1.6rem + 10vw, 4.8rem);
    /* 72-160 */
    --heading1: clamp(2.2rem, -0.8rem + 6.25vw, 3.2rem);
    /* 32-64px */
    --heading2: calc(var(--body) * 1.5);
    /* 24-27px */
    --heading3: calc(var(--body) * 1.2);
    /* 19.2-21.6px */
    --small-heading2: clamp(var(--heading2) * 0.85);
    /* 14-27px */
    --small-heading3: calc(var(--heading3) * 0.85);
    /* 12-23px */
    --small-body: calc(var(--body) * 0.85);
    /* スペース（余白・間隔） */
    --space-xs: clamp(1rem, -0.8rem + 3.75vw, 1.6rem);
    /* 20-30px */
    --space-sm: calc(var(--space-xs) * 1.5);
    /* 30-45px */
    --space-md: calc(var(--space-xs) * 2);
    /* 40-60px */
    --space-lg: calc(var(--space-xs) * 3);
    /* 60-90px */
    --space-xl: calc(var(--space-xs) * 4);
    /* 80-120px */
    --space-jump: clamp(4.5rem, -3.6rem + 16.88vw, 7.2rem);
    /* 20-60px */
    --font-base: "游ゴシック", YuGothic, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.center,
.has-text-align-center {
    text-align: center !important;
}

.left {
    text-align: left !important;
}

.right,
.has-text-align-right {
    text-align: right !important;
}

.fstart {
    display: flex !important;
    justify-content: flex-start;
}

.fcenter {
    display: flex !important;
    justify-content: center;
}

.fend {
    display: flex !important;
    justify-content: flex-end;
}

.valign-top {
    vertical-align: top !important;
}

.valign-middle {
    vertical-align: middle !important;
}

.smt {
    scroll-margin-top: 100px;
}

.primary {
    color: var(--primary) !important;
}

.secondary {
    color: var(--secondary) !important;
}

.white {
    color: var(--white) !important;
}

.red {
    color: var(--red) !important;
}

.black {
    color: var(--black) !important;
}

.link {
    color: var(--link) !important;
}

.bc-red {
    background-color: var(--red) !important;
}

.bc-blue {
    background-color: var(--blue) !important;
}

.bc-green {
    background-color: var(--green) !important;
}

.bold {
    font-weight: bold;
}

.gap-xxs {
    gap: calc(var(--space-xs) / 2) !important;
}

.gap-xs {
    gap: var(--space-xs) !important;
}

.gap-sm {
    gap: var(--space-sm) !important;
}

.gap-md {
    gap: var(--space-md) !important;
}

.gap-lg {
    gap: var(--space-lg) !important;
}

.gap-xl {
    gap: var(--space-xl) !important;
}

.gap-jump {
    gap: var(--space-jump) !important;
}

.mt-none {
    margin-top: 0 !important;
}

.mt-xxs {
    margin-top: calc(var(--space-xs) / 2) !important;
}

.mt-xs {
    margin-top: var(--space-xs) !important;
}

.mt-sm {
    margin-top: var(--space-sm) !important;
}

.mt-md {
    margin-top: var(--space-md) !important;
}

.mt-lg {
    margin-top: var(--space-lg) !important;
}

.mt-xl {
    margin-top: var(--space-xl) !important;
}

.mt-jump {
    margin-top: var(--space-jump) !important;
}

.mb-none {
    margin-bottom: 0 !important;
}

.mb-xxs {
    margin-bottom: calc(var(--space-xs) / 2) !important;
}

.mb-xs {
    margin-bottom: var(--space-xs) !important;
}

.mb-sm {
    margin-bottom: var(--space-sm) !important;
}

.mb-md {
    margin-bottom: var(--space-md) !important;
}

.mb-lg {
    margin-bottom: var(--space-lg) !important;
}

.mb-xl {
    margin-bottom: var(--space-xl) !important;
}

.mb-jump {
    margin-bottom: var(--space-jump) !important;
}

.mi-auto {
    margin-inline: auto;
}

.mlem002 {
    margin-left: 0.2em !important;
}

.mlem01 {
    margin-left: 1em !important;
}

.mlem012 {
    margin-left: 1.2em !important;
}

.mlem02 {
    margin-left: 2em !important;
}

.mlem03 {
    margin-left: 3em !important;
}

.mlem04 {
    margin-left: 4em !important;
}

.file {
    display: block;
    width: 100%;
    max-width: 4rem;
}

.file[href]:hover {
    opacity: 0.8;
    cursor: pointer;
}

.file img {
    display: block;
    width: 100%;
}

.fs-small-body {
    font-size: var(--small-body);
}

.ind01 {
    text-indent: -1em;
    padding-left: 1em;
}

.ind012 {
    text-indent: -1.2em;
    padding-left: 1.2em;
}

.ind02 {
    text-indent: -2em;
    padding-left: 2em;
}

.ind03 {
    text-indent: -3.2em;
    padding-left: 3.2em;
}

.ind04 {
    text-indent: -4em;
    padding-left: 4em;
}

.lem01 {
    text-indent: 1em;
}

.lem02 {
    text-indent: 2em;
}

.plem01 {
    padding-left: 1em !important;
}

.plem02 {
    padding-left: 2em !important;
}

.plem03 {
    padding-left: 3em !important;
}

.plem04 {
    padding-left: 4em !important;
}

.w01 {
    width: 1%;
}

.w02 {
    width: 2%;
}

.w03 {
    width: 3%;
}

.w04 {
    width: 4%;
}

.w05 {
    width: 5%;
}

.w06 {
    width: 6%;
}

.w07 {
    width: 7%;
}

.w08 {
    width: 8%;
}

.w09 {
    width: 9%;
}

.w10 {
    width: 10%;
}

.w11 {
    width: 11%;
}

.w12 {
    width: 12%;
}

.w13 {
    width: 13%;
}

.w14 {
    width: 14%;
}

.w15 {
    width: 15%;
}

.w16 {
    width: 16%;
}

.w17 {
    width: 17%;
}

.w18 {
    width: 18%;
}

.w19 {
    width: 19%;
}

.w20 {
    width: 20%;
}

.w21 {
    width: 21%;
}

.w22 {
    width: 22%;
}

.w23 {
    width: 23%;
}

.w24 {
    width: 24%;
}

.w25 {
    width: 25%;
}

.w26 {
    width: 26%;
}

.w27 {
    width: 27%;
}

.w28 {
    width: 28%;
}

.w29 {
    width: 29%;
}

.w30 {
    width: 30%;
}

.w31 {
    width: 31%;
}

.w32 {
    width: 32%;
}

.w33 {
    width: 33%;
}

.w34 {
    width: 34%;
}

.w35 {
    width: 35%;
}

.w36 {
    width: 36%;
}

.w37 {
    width: 37%;
}

.w38 {
    width: 38%;
}

.w39 {
    width: 39%;
}

.w40 {
    width: 40%;
}

.w41 {
    width: 41%;
}

.w42 {
    width: 42%;
}

.w43 {
    width: 43%;
}

.w44 {
    width: 44%;
}

.w45 {
    width: 45%;
}

.w46 {
    width: 46%;
}

.w47 {
    width: 47%;
}

.w48 {
    width: 48%;
}

.w49 {
    width: 49%;
}

.w50 {
    width: 50%;
}

.w51 {
    width: 51%;
}

.w52 {
    width: 52%;
}

.w53 {
    width: 53%;
}

.w54 {
    width: 54%;
}

.w55 {
    width: 55%;
}

.w56 {
    width: 56%;
}

.w57 {
    width: 57%;
}

.w58 {
    width: 58%;
}

.w59 {
    width: 59%;
}

.w60 {
    width: 60%;
}

.w61 {
    width: 61%;
}

.w62 {
    width: 62%;
}

.w63 {
    width: 63%;
}

.w64 {
    width: 64%;
}

.w65 {
    width: 65%;
}

.w66 {
    width: 66%;
}

.w67 {
    width: 67%;
}

.w68 {
    width: 68%;
}

.w69 {
    width: 69%;
}

.w70 {
    width: 70%;
}

.w71 {
    width: 71%;
}

.w72 {
    width: 72%;
}

.w73 {
    width: 73%;
}

.w74 {
    width: 74%;
}

.w75 {
    width: 75%;
}

.w76 {
    width: 76%;
}

.w77 {
    width: 77%;
}

.w78 {
    width: 78%;
}

.w79 {
    width: 79%;
}

.w80 {
    width: 80%;
}

.w81 {
    width: 81%;
}

.w82 {
    width: 82%;
}

.w83 {
    width: 83%;
}

.w84 {
    width: 84%;
}

.w85 {
    width: 85%;
}

.w86 {
    width: 86%;
}

.w87 {
    width: 87%;
}

.w88 {
    width: 88%;
}

.w89 {
    width: 89%;
}

.w90 {
    width: 90%;
}

.w91 {
    width: 91%;
}

.w92 {
    width: 92%;
}

.w93 {
    width: 93%;
}

.w94 {
    width: 94%;
}

.w95 {
    width: 95%;
}

.w96 {
    width: 96%;
}

.w97 {
    width: 97%;
}

.w98 {
    width: 98%;
}

.w99 {
    width: 99%;
}

.w100 {
    width: 100%;
}