/* フォント */
.lh-15 {
    line-height: 1.5;
}

.lh-2 {
    line-height: 2;
}

.c-656 {
    color: #65689F;
}

.c-304 {
    color: #30416B;
}
.bgc-304 {
    background-color: #30416B;
}

.c-gra {
    background: radial-gradient(circle, #1c60b3 0%, #2b6cb6 18%, #d7b3ca 54%, rgba(241, 227, 191, 0.8) 100%);
    background-position: 70% -50%;
    background-size: 200%;
    color: transparent;
    animation: gradation 10s linear 0s infinite;
    -webkit-background-clip: text;
}
.bgc-gra {
    background: linear-gradient(to right, #afc5e6 0%, rgba(217, 221, 231, 0.78) 41%, rgba(248, 230, 235, 0.76) 59%, #f5efdc 100%);
}

.bgc-ded {
    background-color: rgb(211, 222, 235, 0.2);
}

.c-1a5 {
    color: #1A57B1;
}

.c-128 {
    color: #128DB1;
}

.f-bd {
    font-weight: bold;
}

.jo-re {
    font-family: "Jost", sans-serif;
    font-weight: 400;
}

.jo-se {
    font-family: "Jost", sans-serif;
    font-weight: 600;
}

.po-se {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
}

.he-th {
    font-family: "Heebo", sans-serif;
    font-weight: 100;
}

.he-ex {
    font-family: "Heebo", sans-serif;
    font-weight: 200;
}

.he-li {
    font-family: "Heebo", sans-serif;
    font-weight: 300;
}

.he-re {
    font-family: "Heebo", sans-serif;
    font-weight: 400;
}

.he-me {
    font-family: "Heebo", sans-serif;
    font-weight: 500;
}

.he-se {
    font-family: "Heebo", sans-serif;
    font-weight: 600;
}

.he-bo {
    font-family: "Heebo", sans-serif;
    font-weight: 700;
}

.ib-li {
    font-family: "IBM Plex Sans JP", sans-serif;
    font-weight: 300;
}

.ib-re {
    font-family: "IBM Plex Sans JP", sans-serif;
    font-weight: 400;
}

.ib-me {
    font-family: "IBM Plex Sans JP", sans-serif;
    font-weight: 500;
}

.ib-se {
    font-family: "IBM Plex Sans JP", sans-serif;
    font-weight: 600;
}

.ib-bo {
    font-family: "IBM Plex Sans JP", sans-serif;
    font-weight: 700;
}

.f-10 {
    font-size: calc((10 / 1440)* 100vw);
}

.f-12 {
    font-size: calc((12 / 1440)* 100vw);
}

.f-14 {
    font-size: calc((14 / 1440)* 100vw);
}

.f-16 {
    font-size: calc((16 / 1440)* 100vw);
}

.f-18 {
    font-size: calc((18 / 1440)* 100vw);
}

.f-20 {
    font-size: calc((20 / 1440)* 100vw);
}

.f-22 {
    font-size: calc((22 / 1440)* 100vw);
}

.f-24 {
    font-size: calc((24 / 1440)* 100vw);
}

.f-26 {
    font-size: calc((26 / 1440)* 100vw);
}

.f-28 {
    font-size: calc((28 / 1440)* 100vw);
}

.f-30 {
    font-size: calc((30 / 1440)* 100vw);
}

.f-32 {
    font-size: calc((32 / 1440)* 100vw);
}

.f-34 {
    font-size: calc((34 / 1440)* 100vw);
}

.f-36 {
    font-size: calc((36 / 1440)* 100vw);
}

.f-38 {
    font-size: calc((38 / 1440)* 100vw);
}

.f-40 {
    font-size: calc((40 / 1440)* 100vw);
}

.f-45 {
    font-size: calc((45 / 1440)* 100vw);
}

.f-50 {
    font-size: calc((50 / 1440)* 100vw);
}

.f-60 {
    font-size: calc((60 / 1440)* 100vw);
}

@media (max-width: 768px) {
    .f-10 {
        font-size: 10px;
    }

    .f-12 {
        font-size: 12px;
    }

    .f-14 {
        font-size: 14px;
    }

    .f-16 {
        font-size: 16px;
    }

    .f-18 {
        font-size: 18px;
    }

    .f-20 {
        font-size: 18px;
    }

    .f-22 {
        font-size: 18px;
    }

    .f-24 {
        font-size: 20px;
    }

    .f-26 {
        font-size: 20px;
    }

    .f-28 {
        font-size: 24px;
    }

    .f-30 {
        font-size: 24px;
    }

    .f-32 {
        font-size: 24px;
    }

    .f-34 {
        font-size: 24px;
    }

    .f-36 {
        font-size: 24px;
    }

    .f-38 {
        font-size: 24px;
    }

    .f-40 {
        font-size: 24px;
    }

    .f-45 {
        font-size: 24px;
    }

    .f-50 {
        font-size: 24px;
    }

    .f-60 {
        font-size: 30px;
    }
}

/* マージン */
.mb-5 {
    margin-bottom: calc((5 / 1440)* 100vw);
}

.mb-10 {
    margin-bottom: calc((10 / 1440)* 100vw);
}

.mb-20 {
    margin-bottom: calc((20 / 1440)* 100vw);
}

.mb-30 {
    margin-bottom: calc((30 / 1440)* 100vw);
}

.mb-40 {
    margin-bottom: calc((40 / 1440)* 100vw);
}

.mb-50 {
    margin-bottom: calc((50 / 1440)* 100vw);
}

.mb-60 {
    margin-bottom: calc((60 / 1440)* 100vw);
}

.mb-70 {
    margin-bottom: calc((70 / 1440)* 100vw);
}

.mb-80 {
    margin-bottom: calc((80 / 1440)* 100vw);
}

.mb-90 {
    margin-bottom: calc((90 / 1440)* 100vw);
}

.mb-100 {
    margin-bottom: calc((100 / 1440)* 100vw);
}

.mb-120 {
    margin-bottom: calc((120 / 1440)* 100vw);
}

.mb-180 {
    margin-bottom: calc((180 / 1440)* 100vw);
}

@media (max-width: 768px) {
    .mb-5 {
        margin-bottom: 5px;
    }

    .mb-10 {
        margin-bottom: 12px;
    }

    .mb-20 {
        margin-bottom: 15px;
    }

    .mb-30 {
        margin-bottom: 15px;
    }

    .mb-40 {
        margin-bottom: 30px;
    }

    .mb-50 {
        margin-bottom: 35px;
    }

    .mb-60 {
        margin-bottom: 35px;
    }

    .mb-70 {
        margin-bottom: 45px;
    }

    .mb-80 {
        margin-bottom: 50px;
    }

    .mb-90 {
        margin-bottom: 50px;
    }

    .mb-100 {
        margin-bottom: 50px;
    }

    .mb-120 {
        margin-bottom: 50px;
    }
}


/* ハンバーガーメニュー */
.mobileBtn__wrapper {
    background-color: #1E293D;
    width: 70px;
    height: 30px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

.mobileBtn {
    transition: all 0.8s ease;
    position: relative;
    z-index: 101;
    background-color: unset;
    width: 18px;
    height: 30px;
  }
  
  .mobileBtn__bar {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    transform: translateY(-50%);
    transition: all 0.8s ease;
    background-color: white;
    left: 0;
  }
  
  .mobileBtn__bar:nth-child(1) {
    top: 35%;
  }
  
  .mobileBtn__bar:nth-child(2) {
    top: 50%;
  }
  
  .mobileBtn__bar:nth-child(3) {
    top: 65%;
  }
  
  .mobileBtn__bar.rotate:nth-child(1), .mobileBtn__bar.rotate:nth-child(3) {
    top: 50%;
  }
  
  .mobileBtn__bar.rotate:nth-child(1) {
    transform: rotate(-225deg);
  }
  
  .mobileBtn__bar.rotate:nth-child(2) {
    transform: translate(0%, -50%) scale(0);
  }
  
  .mobileBtn__bar.rotate:nth-child(3) {
    transform: rotate(225deg);
  }
  
  .mobile {
    overflow: scroll;
    width: 100vw;
    height: 100vh;
    background-color: white;
    background-size: cover;
    position: fixed;
    top: -200vh;
    right: 0;
    z-index: 98;
    transition: all 0.5s ease;
  }
  
  .mobile.down {
    top: 0;
  }
  
  .mobile__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    margin: 35px auto 0;
  }
  
  .mobile__ul {
    width: 90%;
    margin: 0 auto;
    padding-top: 30px;
  }
  
  .mobile__li {
    font-size: 14px;
    margin: 0;
  }
  .mobile__li > a {
    border-bottom: 2px solid #cecece;
    padding: 20px;
    color: white;
  }
  
  @media (max-width: 768px) {
    .mobileBtn__wrapper {
        display: flex;
    }
  }
  .header {
    position: fixed;
    width: 100%;
    z-index: 9999;
    padding-top: calc((30 / 1440)* 100vw);
  }
  .header__inner {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;

    /* width: calc(100% - calc((20 / 1440) * 100vw));
    margin: 0 auto; */
  }
  .header__logo {
    width: calc((245 / 1440)* 100vw);
  }
  .header__ul {
    display: flex;
    align-items: center;
    background-color: white;
    padding: calc((15 / 1440)* 100vw) calc((40 / 1440)* 100vw);
    border-radius: 50px;
  }
  .header__li > a {
    margin: 0 calc((22 / 1440)* 100vw) 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #30416B;
  }

  .header__li-contact > a {
    margin: 0;
    color: white;
    width: calc((100 / 1440)* 100vw);
    height: calc((30 / 1440)* 100vw);
    border-radius: 50px;
    background-color: #128DB1;
    justify-content: center;
  }

/* フッター */
.footer {
    padding: calc((90 / 1440)* 100vw) 0;
    border-top: 1px solid #e4e4e4;
    color: #30416B;
}

.footer__inner {
    display: flex;
    justify-content: space-between;
    width: calc(100% - calc((240 / 1440)* 100vw));
    margin: 0 auto;
}

.footer__txt {
    line-height: 2;
}

.footer__nav {
    display: flex;
}

.footer__ul {
    margin-right: calc((50 / 1440)* 100vw);
}
.footer__ul:last-child {
    margin-right: 0;
}

@media (max-width: 768px) {
    .header {
        padding: 10px 0;
    }

    .header__ul {
        display: none;
    }

    .header__logo {
        width: 120px;
    }

    /* フッター */
    .footer {
        padding: 50px 0;
    }

    .footer__inner {
        flex-direction: column;
        width: calc(100% - 40px);
        margin: 0 auto;
    }

    .footer__txt {
        margin-bottom: 65px;
    }

    .footer__nav {
        flex-direction: column;
    }

    .footer__ul {
        margin-right: 0;
        margin-bottom: 50px;
    }

    .footer__li.f-24 {
        font-size: 18px;
        margin-bottom: 16px;
    }
}