/* ここから共通設定 */

img {
    width: 100%;
}

html {
    scroll-padding-top: 80px;
    scroll-behavior: smooth;
}

/* ここまで共通設定 */

/* ここから共通クラス */

.inner {
    width: 1200px;
    max-width: calc(355 / 375 * 100vw);
    margin: auto;
}

:root {
    --themeColor: #0F5B38;
    --subColor: #333333;
    --fontPrimary: 'M PLUS 1', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    --fontSecondary: 'Nunito Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.section__subTtl {
    font-size: 1.375rem;
    font-family: var(--fontSecondary);
    font-weight: 700;
    text-align: center;
    @media screen and  (max-width: 1100px){
        font-size: 1.3rem;
    }
    @media screen and  (max-width: 960px){
        font-size: 1.25rem;
    }
}

.section__ttl {
    font-size: 3rem;
    font-weight: 500;
    font-family: var(--fontPrimary);
    text-align: center;
    @media screen and  (max-width: 1100px){
        font-size: 2.75rem;
    }
    @media screen and  (max-width: 960px){
        font-size: 2.5rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 2.25rem;
    }
}

.fadein {
    opacity: 0;
    transform: translate(0,0);
    transition: all 1.5s;
}

.fadein.fadein-bottom {
    transform: translate(0,30px);
}

.fadein.scrollin {
    opacity: 1 !important;
    transform: translate(0,0) !important;
}

/* ここまで共通クラス */

@keyframes fadeInSite {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

body {
    background: #EAF5F0;
    scrollbar-gutter: stable;
}

body.is-loading {

}

/* ローディング画面の土台 */
.body__loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background-color: #EAF5F0;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.8s ease, visibility 0.8s ease;
}

.body__loader.is-loaded {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s 0.2s ease, visibility 0.8s 0.2s ease;
}

.loader__inner,
.loader__outline,
.loader__logo-full,
.loader__text {
    will-change: transform, opacity;
}

.loader__inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease;
}

.body__loader.is-loaded .loader__inner {
    transform: scale(1.3);
    opacity: 0;
}

.loader__wrapper {
    position: relative;
    width: 300px;
    aspect-ratio: 875.22 / 1000;
    height: auto;
    @media screen and  (max-width: 767px){
        width: 280px;
    }
    @media screen and  (max-width: 600px){
        width: 260px;
    }
    @media screen and  (max-width: 375px){
        width: 240px;
    }
}

.loader__outline {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    animation: fadeOutOutline 0.3s 2.9s forwards;
}

.js-outline-path {
    fill: none;
    stroke: #094328;
    stroke-width: 2;
    stroke-dasharray: var(--path-length);
    stroke-dashoffset: var(--path-length);
    animation: drawPath 2.8s ease-in-out forwards;
}

@keyframes drawPath {
    to {
        stroke-dashoffset: 0;
    }
}

.loader__logo-full {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0;
    animation: revealAndThenScale 1.05s 2.8s ease-out forwards;
}

.loader__logo-full img {
    display: block;
    width: 100%;
    height: auto;
}

@keyframes fadeOutOutline {
    to {
        opacity: 0;
    }
}

@keyframes revealAndThenScale {
    0% {
        opacity: 0;
    }
    /* 1. 最初のリズム：0.5秒かけて表示完了 (全体の33%) */
    40% {
        opacity: 1;
    }
    /* 2. 三つ目のリズム：0.5秒かけて1.2倍に拡大 (全体の100%) */
    100% {
        opacity: 1;
    }
}

.loader__text {
    font-size: 2.5rem;
    color: #094328;
    font-weight: 500;
    font-family: var(--fontPrimary);
    white-space: nowrap;
    opacity: 0;
    animation: fadeInText 3.0s forwards;
    @media screen and  (max-width: 767px){
        font-size: 2rem;
    }
    @media screen and  (max-width: 600px){
        text-align: center;
    }
    @media screen and  (max-width: 375px){
        font-size: 1.75rem;
        font-weight: 500;
    }
}

@keyframes fadeInText {
    to { opacity: 1; }
}

.loader__textBr {
    display: none;
    @media screen and  (max-width: 600px){
        display: block;
    }
}

/* サイト表示時のフェードアウト */
.body__loader.is-loaded {
    opacity: 0;
    visibility: hidden;
}

/* ここからheader */

.header {
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 20px;
    background: #ffffff;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    @media screen and  (max-width: 767px){
        height: 60px;
        padding-left: 7.5px;
    }
}k

.header__logo {
}

.header__logoLink {
    display: flex;
    gap: 5px;
    align-items: center;
}

.header__logoImgWrap {
    width: 214px;
    @media screen and  (max-width: 960px){
        width: 175px;
    }
}

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

.header__right {
    display: flex;
    gap: 17.5px;
    height: 100%;
    align-items: center;
    @media screen and  (max-width: 1100px){
        gap: 12px;
    }
}

.header__nav {
    height: 100%;
    @media screen and  (max-width: 767px){
        display: none;
    }
}

.header__navList {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    @media screen and  (max-width: 1100px){
        font-size: 14px;
    }
}

.header__navItem {
    background-color: #ffffff; /* メニューアイテムの背景色 */
    position: relative;
    transition: background-color .3s; /* 背景色の変化をアニメーション化 */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s, color 0.3s;
    height: 100%;
}

.header__navLink {
    color: var(--subColor);
    cursor: pointer;
    width: auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 17.5px;
    font-size: 1rem;
    font-weight: 430;
    font-family: var(--fontPrimary);
    white-space: nowrap;
    @media screen and  (max-width: 960px){
        font-size: 0.875rem;
        padding: 0 16px;
    }
}

.header__navLink:hover {
    background-color: #d6d6d6;
}

.navItem__dropMenu {
    position: relative;
}

.header__navItem:hover .dropMenu__list {
    transform: scaleY(1);
}

.dropMenu__list {
    left: 0;
    position: absolute;
    top: 100%;
    transform: scaleY(0);
    transform-origin: center top;
    transition: transform .3s;
    width: max-content;
    z-index: 1;
    width: 100%;
}

.dropMenu__item {
    background-color: #ffffff;
    transition: opacity .3s;
    color: var(--subColor);
    width: 120%;
    transition: background-color 0.3s, color 0.3s;
}

.dropMenu__item:hover {
    background-color: #d6d6d6;
}

.dropMenu__link {
    padding: 10px 17.5px;
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    height: 100%;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    font-size: 1rem;
    font-weight: 450;
    white-space: nowrap;
    @media screen and  (max-width: 960px){
        font-size: 0.875rem;
    }
}



.header__ctaButtonWrap {
    background: var(--themeColor);
    width: 160px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: var(--fontPrimary);
    color: #ffffff;
    font-size: 1rem;
    text-align: center;
    font-weight: 430;
    transition: 0.2s;
    @media screen and  (max-width: 1100px){
        width: 140px;
    }
    @media screen and  (max-width: 767px){
        width: 90px;
        font-size: 0.8rem;
    }
}

.header__ctaButtonWrap:hover {
    background: #42956E;
}

.header__drawerMenu {
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    gap: 8px;
    display: none;
    position: relative;
    z-index: 1001;
    @media screen and  (max-width: 767px){
        display: block;
    }
}

.drawerMenu__icoWrap {
    display: flex;
    flex-direction: column;
    gap: 13.5px;
    position: relative;
    @media screen and  (max-width: 767px){
        gap: 9px;
    }
}

.icoWrap__bar1, .icoWrap__bar2, .icoWrap__bar3 {
    width: 48px;
    height: 1px;
    background: #333333;
    @media screen and  (max-width: 767px){
        width: 32px;
    }
}

.icoWrap__bar1 {
}

.icoWrap__bar2 {
}

.icoWrap__bar3 {
}

.drawerMenu__icoWrap.active .icoWrap__bar1 {
    transform: rotate(45deg);
    position: absolute;
}

.drawerMenu__icoWrap.active .icoWrap__bar2 {
    opacity: 0;
}

.drawerMenu__icoWrap.active .icoWrap__bar3 {
    transform: rotate(-45deg);
    position: absolute;
}

.icoWrap__bar1,
.icoWrap__bar2,
.icoWrap__bar3 {
    transition: all 0.3s;
}

.header__drawerContent {
    background: #ffffff;
    width: 225px;
    height: calc(100vh - 80px);
    margin-top: 80px;
    position: fixed;
    z-index: 1000;
    top: 0;
    right: 0;
    transform: translateX(105%);
    transition: transform 0.5s ease 0s;
    padding-top: 20px;
    @media screen and  (max-width: 767px){
        width: 180px;
        height: calc(100vh - 60px);
        margin-top: 60px;
    }
}

.header__drawerContent.visible {
    transform: translateX(0);
}

.header__drawerContentList {
}

.header__drawerContentItem {
    border-bottom: 1px solid var(--colorTheme);
    width: 100%;
}

.header__drawerContentLink {
    padding: 12px 0;
    color: var(--subColor);
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    max-width: 85%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: start;
}

.drawerContent__dropList {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 85%;
    margin: 0 auto;
    padding: 12px 0;
}

.drawerContent__dropItem {
    padding-left: 30px;
    position: relative;
    color: var(--subColor);
    font-size: 1rem;
    font-weight: 430;
    font-family: var(--fontPrimary);
}

.drawerContent__dropItem::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 15px;
    height: 1px;
    background: var(--subColor);

}

.drawerContent__dropLink {
}


/* ここまでheader */

/* ここからmain */

.main {
    margin-top: 80px;
    @media screen and  (max-width: 767px){
        margin-top: 60px;
    }
}

/* ここからmv */

.mv {
    position: relative;
    display: flex;
    justify-content: end;
    @media screen and  (max-width: 600px){
        padding-bottom: 80px;
    }
}

.mv__imgWrap {
    max-width: clamp(340px, 87.14vw, 1220px);
    width: 100%;
    height: clamp(500px, 457.7465px + 11.2676vw, 620px);
    border-radius: 40px 0 0 40px;
    overflow: hidden;
    min-width: 0;

}

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

.mv__swiper .swiper-slide {
    width: 100%;
    height: 100%;
}

.mv__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@keyframes fadeSlide {
  0% {
    opacity: 0;
    transform: translateX(-100%); /* 少し下から浮き上がる */
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.mv__catchcopy {
    position: absolute;
    bottom: clamp(30px, 24.3662px + 1.5023vw, 46px);
    left: clamp(10px, -16.7606px + 7.1362vw, 86px);
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: start;
    z-index: 10;
    @media screen and  (max-width: 600px){
        bottom: 100px;
    }
}
.mv__catchcopyLine {
    opacity: 0;
    position: relative;
    width: auto;
    height: 100%;
}

.is-ready .mv__catchcopyLine {
    animation: fadeSlide 1s ease-out forwards;
}

.is-ready .mv__catchcopyLine--slide01 {
    animation-delay: 0.2s;
}
.is-ready .mv__catchcopyLine--slide02 {
    animation-delay: 0.4s;
}
.is-ready .mv__catchcopyLine--slide03 {
    animation-delay: 0.6s;
}

.mv__catchcopyText {
    font-family: var(--fontPrimary);
    font-size: clamp(1.5rem, 1.1rem + 1.69vw, 2.625rem);
    color: var(--subColor);
    line-height: 1.6;
    padding: 0 10px;
    position: relative;
    z-index: 2;
    @media screen and  (max-width: 375px){
        font-size: 1.25rem;
    }
}

.mv__catchcopyBg {
    background: #ffffff;
    opacity: 0.8;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.mv__catchcopyText--large {
    font-size: clamp(2rem, 1.47rem + 2.25vw, 3.5rem);
    @media screen and  (max-width: 375px){
        font-size: 1.75rem;
    }
}

.mv__cta {
    position: absolute;
    bottom: clamp(30px, 24.3662px + 1.5023vw, 46px);
    right: clamp(10px, -16.7606px + 7.1362vw, 86px);
    display: flex;
    gap: 50px;
    z-index: 10;
    @media screen and  (max-width: 960px){
        gap: 20px;
    }
    @media screen and  (max-width: 767px){
        flex-direction: column;
    }
    @media screen and  (max-width: 600px){
        bottom: 0;
        right: 0;
        flex-direction: row;
        gap: 0;
        width: 100%;
    }
}

.mv__ctaBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 150px;
    border-radius: 20px;
    padding: 5px;
    position: relative;
    transition: 0.2s all;
    opacity: 0;
    @media screen and  (max-width: 960px){
        width: 120px;
        height: 120px;
    }
    @media screen and  (max-width: 767px){
        width: 130px;
        height: 100px;
        border-radius: 10px;
    }
    @media screen and  (max-width: 600px){
        width: 100%;
        height: 80px;
        border: 0;
        border-radius: 0;
    }
}

@keyframes popIn {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    70% {
        opacity: 1;
        transform: scale(1.05);
    }
    100% {
        opacity: 1;
        transform: scale(1.0);
    }
}

.is-ready .mv__ctaBtn {
    animation: popIn 1.2s forwards;
}

.is-ready .mv__ctaBtn--team {
    background: #B09905;
    animation-delay: 0.2s;

}
.is-ready .mv__ctaBtn--calender {
    background: var(--themeColor);
    animation-delay: 0.4s;
}

.mv__ctaBtn::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #333333;
    border-radius: 20px;
    opacity: 0.4;
    width: 100%;
    height: 100%;
    opacity: 0; /* 初期状態では非表示 */
    transition: opacity 0.2s; /* ホバー時の変化をアニメーション化 */
}

.mv__ctaBtn:hover::after {
    opacity: 0.3;
}

.mv__ctaBtnInner {
    border: 2px solid #ffffff;
    border-radius: 20px;
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    @media screen and  (max-width: 767px){
        border-radius: 10px;
        padding: 0 10px;
    }
    @media screen and  (max-width: 600px){
        border-radius: 0;
        justify-content: start;
        gap: 20px;
    }
}

.mv__ctaBtnInner::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: #ffffff;
    width: auto;
    height: 20px;
    width: 10.5px;
    left: 50%;
    bottom: 10px;
    z-index: 2;
    transform: translateX(-50%) rotate(90deg);
    transition: 0.1s all;
    @media screen and  (max-width: 767px){
        display: none;
    }
    @media screen and  (max-width: 600px){
        display: flex;
        left: auto;
        right: 10%;
        bottom: 50%;
        transform: translateY(50%) rotate(90deg);
    }
}

.mv__ctaBtn:hover .mv__ctaBtnInner::after {
    bottom: 5px;
    @media screen and  (max-width: 600px){
        bottom: 50%;
        transform: translateY(50%) rotate(90deg);
    }
}

.mv__ctaBtnInner--team {
}

.mv__ctaBtnImgWrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 88%;
    height: auto;
    z-index: 1;
    @media screen and  (max-width: 767px){
        width: 60%;
    }
    @media screen and  (max-width: 600px){
        width: auto;
        height: 75%;
        left: 15%;
    }
    @media screen and  (max-width: 480px){
        left: 20%;
    }
}

.mv__ctaBtnImg {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mv__ctaBtnText {
    font-family: var(--fontPrimary);
    position: relative;
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 430;
    line-height: 1.4;
    z-index: 2;
    text-align: center;
    @media screen and  (max-width: 960px){
        font-size: 1rem;
    }
    @media screen and  (max-width: 767px){
    }
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        text-align-last: left;
        margin-left: 26%;
    }
    @media screen and  (max-width: 480px){
        font-weight: 400;
        margin-left: 10%;
    }
    @media screen and  (max-width: 375px){
        font-size: 1rem;
    }
}

.mv__ctaBtnTextBr {
}

.mv__ctaBtnInner--calender {
}

/* ここまでmv */

/* ここからpolicy */

.policy {
    position: relative;
}

.policy__bgText {
    font-size: clamp(5rem, 3.15rem + 7.89vw, 10.25rem);
    font-weight: 900;
    line-height: 1;
    color: #CFEBDD;
    font-family: var(--fontSecondary);
    position: absolute;
    top: -20px;
    left: 0;
    @media screen and  (max-width: 767px){
        top: 0;
    }
}

.policy__bgText--lh {
    line-height: 0.7;
}

.policy__inner {
}

.policy__text {
    color: var(--subColor);
    font-family: var(--fontPrimary);
    font-size: 1.25rem;
    font-weight: 430;
    line-height: 1.8;
    text-align: center;
    position: relative;
    z-index: 10;
    padding: 92.5px 0;
    @media screen and  (max-width: 767px){
    }
}

.policy__textBr {
    @media screen and  (max-width: 960px){
        display: none;
    }
}

/* ここまでpolicy */

/* ここからabout */

.about {
}

.about__nav {
    display: flex;
    gap: 30px;
    justify-content: center;
    margin: 0 10px;
    @media screen and  (max-width: 767px){
        gap: clamp(10px, -9.1327px + 5.1020vw, 30px);
    }
}

.about__tab {
    width: 200px;
    height: 55px;
    border-radius: 20px 20px 0 0;
    border-width: 2px 2px 0 2px;
    border-style: solid;
    border-color: var(--themeColor);
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: var(--fontPrimary);
    font-size: 1.125rem;
    font-weight: 430;
    color: var(--themeColor);
    transition: 0.2s all;
    @media screen and  (max-width: 767px){
        font-size: 1rem;
    }
    @media screen and  (max-width: 480px){
        font-size: 0.875rem;
        height: 45px;
        border-radius: 16px 16px 0 0;
    }
}

.about__tab:hover {
    background: #42956E;
    color: #ffffff;
    border-color: #42956E;
}

.about__tab.is-active {
    background: var(--themeColor);
    color: #ffffff;
}

.about__tab.is-active:hover {
    background: #42956E;
    border-color: #42956E;
}

.about__content {
    width: 100%;
    background: #ffffff;
    padding: 100px 0;
}

.about__pane {
    display: none;
    opacity: 0;
    animation: fadeIn 0.5s forwards;
    height: auto;
}

.about__pane.is-active {
    display: flex;
    opacity: 1;
    gap: clamp(20px, -40.0000px + 6.2500vw, 50px);
    @media screen and  (max-width: 960px){
        flex-direction: column-reverse;
        gap: 50px;
    }
}

.about__imgWrap {
    max-width: clamp(460px, 180.0000px + 29.1667vw, 600px);
    width: 100%;
    max-height: 650px;
    @media screen and  (max-width: 960px){
        max-width: 100%;
        width: 100%;
        height: 550px;
    }
    @media screen and  (max-width: 767px){
        height: 450px;
    }
    @media screen and  (max-width: 480px){
        height: 320px;
    }
}

.about__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.about__textWrapper {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: 25px;
    @media screen and  (max-width: 1100px){
        gap: 20px;
    }
    @media screen and  (max-width: 960px){
        width: 100%;
        max-width:  calc(355 / 375 * 100vw);
    }
}

.about__ttlWrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    gap: 5px;
}

.about__subTtl {
    font-size: 1.125rem;
    color: var(--themeColor);
    font-family: var(--fontSecondary);
    font-weight: 600;
}

.about__ttl {
    font-size: 2rem;
    line-height: 1.4;
    font-family: var(--fontPrimary);
    font-weight: 400;
    @media screen and  (max-width: 1100px){
        font-size: 1.8rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 1.6em;
    }
}

.about__ttlBr {
}

.about__descriptionBody {
    display: flex;
    flex-direction: column;
    gap: 19px;
    @media screen and  (max-width: 767px){
        gap: 15px;
    }
}

.about__description {
    max-width: 550px;
    width: 100%;
    font-family: var(--fontPrimary);
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 400;
    color: #333333;
    font-family: var(--fontPrimary);
    @media screen and  (max-width: 1100px){
        max-width: 100%;
    }
    @media screen and  (max-width: 767px){
        line-height: 1.4;
    }
}

.about__descriptionBr {
    @media screen and  (max-width: 960px){
        display: none;
}
}

.about__btn {
    max-width: 240px;
    width: 100%;
    height: 55px;
    background: var(--themeColor);
    border-radius: 30px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #ffffff;
    font-family: var(--fontPrimary);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s;
    position: relative;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.about__btn:hover {
    background: #42956E;
}

.about__btn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: #ffffff;
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s all;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.about__btn:hover::after {
    background-color: #ffffff;
    right: 15px;
}

.about__btn:hover::after {
}

/* ここまでabout */

/* ここからintroduction */

.introduction {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin-bottom: 100px;
}

.introduction__team {
    margin-bottom: 100px;
}

.introduction__bgText {
    position: absolute;
    top: 0;
    left: 0;
    font-family: var(--fontSecondary);
    font-size: clamp(5rem, 1.91rem + 13.15vw, 13.75rem);
    line-height: 0.95;
    color: #CFEBDD;
    white-space: nowrap;
    font-weight: 900;
    transform-origin: left top;
    transform: rotate(90deg) translateY(-84%);
    @media screen and  (max-width: 767px){
    }
    @media screen and  (max-width: 375px){
    }
}

.introduction__bgTextBr {
}

.introduction__inner {
    position: relative;
    z-index: 10;
    padding-top: 100px;
}

.introduction__ttlWrap {

}

.section__ttlWrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.introduction__subTtl {
    color: var(--themeColor);
}

.introduction__ttl {
    color: var(--subColor);
}

.introduction__lead {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    color: var(--subColor);
    margin-top: 30px;
    text-align: center;
    line-height: 1.6;
    @media screen and  (max-width: 767px){
        line-height: 1.4;
    }
}

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

.introduction__leadBr--responsive {
    display: none;
    @media screen and  (max-width: 600px){
        display: block;
    }
}

.introduction__list {
    margin-top: 60px;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 50px;
    @media screen and  (max-width: 767px){
        align-items: center;
        flex-direction: column;
        margin-top: 40px;
    }
}

.introduction__card {
    max-width: 400px;
    width: 100%;
    padding: 20px;
    background: #ffffff;
    border: 2px solid var(--themeColor);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
}

.introduction__cardTtl {
    font-family: var(--fontPrimary);
    font-size: 2rem;
    color: var(--subColor);
    font-weight: 500;
    text-align: center;
    margin-bottom: 10px;
    @media screen and  (max-width: 767px){
        font-size: 1.75rem;
    }
}

.introduction__cardTtlBr {
    display: none;
    @media screen and  (max-width: 1200px){
        display: block;
    }
    @media screen and  (max-width: 960px){
        display: none;
    }
    @media screen and  (max-width: 767px){
        display: block;
    }
}

.introduction__cardDesc {
    margin-top: auto;
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--subColor);
    line-height: 1.4;
    font-weight: 400;
    margin-bottom: 25px;
}

.introduction__cardLogoBody {
    margin-top: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 220px;
}

.introduction__cardLogoWrap {
    max-height: 200px;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.introduction__cardLogoWrap--roots {
    max-width: 283px;
    width: 100%;
    height: auto;
}

.introduction__cardLogo {
    height: 100%;
    width: auto;
    object-fit: cover;
}

.introduction__cardLogo--roots {
}

.introduction__BtnWrap {
    display: flex;
    justify-content: center;
    margin-top: 60px;
}

.introduction__btn {
    width: 300px;
    height: 60px;
    border: 2px solid var(--themeColor);
    background: #ffffff;
    border-radius: 30px;
    font-family: var(--fontPrimary);
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--themeColor);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.2s;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.introduction__btn:hover {
    background: #42956E;
    color: #ffffff;
    border-color: #42956E;
}

.introduction__btn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s all;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.introduction__btn:hover::after {
    background-color: #ffffff;
    right: 15px;
}

.introduction__academy {
    padding-top: 100px;
}

.introduction__contentWrap {
    display: flex;
    justify-content: center;
    gap: 50px;
    margin-top: 60px;
    @media screen and  (max-width: 767px){
        align-items: center;
        flex-direction: column-reverse;
        margin-top: 40px;
    }
}

.introduction__contentBody {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 50px;
    @media screen and  (max-width: 767px){
        max-width: 100%;
    }
}

.introduction__contentText {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--subColor);
    font-weight: 400;
    line-height: 1.6;
    @media screen and  (max-width: 767px){
        line-height: 1.4;
        text-align: center;
        width: 100%;
    }
}

.introduction__contentTextBr {
}

.introduction__contentBtnWrap {
    @media screen and  (max-width: 767px){
        display: none;
    }
}

.introduction__contentBtn {
    width: 300px;
    height: 60px;
    border: 2px solid var(--themeColor);
    background: #ffffff;
    border-radius: 30px;
    font-family: var(--fontPrimary);
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--themeColor);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.2s;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.introduction__contentBtn:hover {
    background: #42956E;
    color: #ffffff;
    border-color: #42956E;
}

.introduction__contentBtn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s all;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.introduction__contentBtn:hover::after {
    background-color: #ffffff;
    right: 15px;
}

.introduction__contentBtnWrap--responsive {
    display: none;
    @media screen and  (max-width: 767px){
        display: flex;
        justify-content: center;
        margin-top: 50px;
    }
}

/* ここまでintroduction */

/* ここからschedule */

.schedule {
    position: relative;
    margin-bottom: 100px;
}

.schedule__inner {
    padding-top: 100px;
    position: relative;
    z-index: 10;
}

.schedule__bgText {
    font-size: clamp(5rem, 30.7px + 13.15vw, 13.75rem);
    color: #CFEBDD;
    font-weight: 900;
    line-height: 0.68;
    position: absolute;
    top: 40px;
    right: 0;
    font-family: var(--fontSecondary);
    transform-origin: center center;
    @media screen and  (max-width: 768px){
        top: 5%;
    }
}

.schedule__ttl {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.schedule__ttl--en {
    font-size: 1.375rem;
    color: var(--themeColor);
    font-family: var(--fontSecondary);
}

.schedule__ttl--jp {
    font-size: 2.75rem;
    color: var(--subColor);
    font-family: var(--fontPrimary);
    font-weight: 700;
}

.schedule__leadBody {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.schedule__lead {
    margin-top: 30px;
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--subColor);
    font-weight: 400;
    display: flex;
    justify-content: center;
    text-align: center;
}

.schedule__leadLegendList {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap;
     @media screen and  (max-width: 767px){
         gap: 20px;
    }
    @media screen and  (max-width: 480px){
        width: 100%;
        margin: auto;
        gap: 15px;
    }
}

.schedule__leadLegendItem {
    display: flex;
    gap: 10px;
    align-items: center;
    @media screen and  (max-width: 480px){
        gap: 5px;
    }
}

.schedule__leadLegendText {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    @media screen and  (max-width: 480px){
        width: 80px;
    }
}

.schedule__leadLegendColor {
    width: 24px;
    height: 24px;
    border-radius: 3px;
}

.schedule__leadLegendColor--lakers {
    background: #ECBB34;
}

.schedule__leadLegendColor--focus {
    background: #E41C17;
}

.schedule__leadLegendColor--baseballClass {
    background: #1FC746;
}

.schedule__wrapper {
    position: relative;
    margin-top: 30px !important;
}

.schedule__loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(57, 57, 57, 0.8); /* グレーで透明度を落とした背景 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100; /* カレンダーより上に表示 */
    transition: opacity 0.3s ease;
    border-radius: 10px; /* カレンダーの角丸に合わせて調整 */
    pointer-events: all;
}

.schedule__loading.is-hide {
    opacity: 0 !important;
    visibility: hidden !important;
    display: none !important; /* 強制的に消す */
    pointer-events: none !important;
}

.loading__content {
    text-align: center;
    font-family: var(--fontPrimary);
    color: #ffffff;
    font-weight: 500;
}

.loading__spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #fff;
    border-top: 4px solid var(--themeColor); /* チームのアクセントカラー */
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 10px;
}

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

.loading__text {
    font-size: 1.5rem;
}

#calendar-container {
}

.fc-header-toolbar {
    position: relative;
}

.fc-toolbar-chunk .fc-button-group {
    display: flex;
    justify-content: space-between;
    position: absolute;
    width: 100%;
    top: 22px;
}

.fc .fc-toolbar-title {
    font-family: var(--fontPrimary) !important;
}

.fc-button-group{
}

.fc .fc-button-group > .fc-button {
    flex: 0 1 auto;
    text-align: center;
}

.fc .fc-button {
}

.fc .fc-button-primary {
    background: none;
    border: none;
}

.fc .fc-prev-button, .fc .fc-next-button {
  background-color: transparent;
  border: none;
  color: #333;
  font-size: 1em;
  font-weight: 500;
  box-shadow: none !important;
  font-family: var(--fontPrimary);
}

.fc .fc-prev-button:hover, .fc .fc-next-button:hover {
  background-color: transparent;
  color: var(--themeColor);
  text-decoration: underline;
}

.fc-today-button {
    display: none !important;
}

.fc-button-group .fc-dayGridMonth-button {
    display: none;
}

.fc-button-group .fc-timeGridWeek-button {
    display: none;
}

/* --- FullCalendarのヘッダー (日, 月, 火...) --- */
.fc .fc-col-header-cell {
    background-color: var(--themeColor);
    border-color: #cccccc;
    text-align: right;
    font-weight: 400;
    font-family: var(--fontPrimary);
}
.fc .fc-col-header-cell-cushion {
    color: #f9f9f9;
    text-decoration: none;
    padding: 0.75em 0.5em;
}

/* カレンダーの日付スタイル */
.fc .fc-daygrid-day-number {
    padding: 6px 8px;
    text-align: right;
    font-family: var(--fontPrimary);
    @media screen and  (max-width: 480px){
        padding: 4px 6px;
        font-size: 0.625em;
    }
}

.fc-theme-standard td, .fc-theme-standard th {
    background: #ffffff;
}

/* 「レイカーズ」のスタイル */
.calendar-Lakers,
.calendar-Lakers .fc-event-main {
    background-color: #ECBB34 !important; /* 水色 */
    color: #FFFFFF !important; /* 文字色 */
    padding: 5px 0 !important;
    cursor: pointer;
    font-family: var(--fontPrimary);
}

/* 「フォーカス」のスタイル */
.calendar-Focus,
.calendar-Focus .fc-event-main {
    background-color: #E41C17 !important; /* ピンク系 */
    color: #FFFFFF !important; /* 文字色 */
    padding: 5px 0 !important;
    cursor: pointer;
    font-family: var(--fontPrimary);
}

/* 「野球教室」のスタイル */
.calendar-classroom,
.calendar-classroom .fc-event-main {
    background-color: #1FC746 !important; /* グリーン系 */
    color: #FFFFFF !important; /* 文字色 */
    padding: 5px 0 !important;
    cursor: pointer;
    font-family: var(--fontPrimary);
}

.fc-event-time {
    width: 100%;
    text-align: center;
    font-weight: 500;
    font-size: 0.9em;
    padding: 2px 0;
    font-family: var(--fontPrimary);
}

.fc-daygrid-event {
    margin-top: 10px !important;    /* 上のイベントとの間隔 */
    margin-bottom: 10px !important; /* 下のイベントとの間隔 */
}


.schedule__modalOverlay {
    display: none;
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}
.schedule__modalOverlay.show {
    display: flex;
}

.schedule__modal {
    background: #fff;
    width: 90%;
    max-width: 500px;
    padding: 40px 30px;
    position: relative;
    border-radius: 8px;
}

.modal__closeBody {
    background: var(--themeColor);
    height: 54px;
    width: 54px;
    position: absolute;
    border-radius: 0 8px 0 8px;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.2s all;
}

.modal__closeBody:hover {
    background: #42956E;
}

.modal__closeIcoWrap {
    width: 24px;
    height: 24px;
}

.modal__closeIco {
}

.modal__content {
}

.modal__date {
    font-family: var(--fontPrimary);
    font-size: 0.9rem;
    color: var(--subColor);
    font-weight: 400;
}

.modal__title {
    font-family: var(--fontPrimary);
    font-size: 1.4rem;
    font-weight: 500;
    margin-bottom: 20px;
    color: var(--themeColor);
}

.modal__info {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--subColor);
    font-weight: 400;
    line-height: 1.4;
}

.modal__item {
}

.modal__label {
    font-weight: 500;
    display: block;
    margin-top: 15px;
    color: #333333;
    font-size: 0.9rem;
}

.modal__text {
    margin-top: 5px;
    line-height: 1.6;
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: #333333;
    font-weight: 400;
}

/* ここまでschedule */

/* ここからinstagram */

.instagram {
    padding-top: 100px;
}

.instagram__inner {
    display: flex;
    flex-direction: column;
}
.instagram__contentBody {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%;
    gap: 50px;
    @media screen and  (max-width: 767px){
        flex-direction: column;
        gap: 30px;
    }
}

.instagram__contentLeft {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    max-width: 750px;
    width: 100%;
    gap: 25px;
    @media screen and  (max-width: 767px){
        max-width: 100%;
    }
}

.instagram__ttlWrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
}

.instagram__subTtl {
    color: var(--themeColor);
}

.instagram__ttl {
    color: var(--subColor);
}

.instagram__lead {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--subColor);
    line-height: 1.6;
    font-weight: 400;
}

.instagram__leadBr {
    @media screen and  (max-width: 767px){
        display: none;
    }
}

.instagram__contentRight {
    max-width: 400px;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(1,1fr);
    justify-items: center;
    gap: 20px;
    @media screen and  (max-width: 767px){
        grid-template-columns: repeat(3,1fr);
        max-width: 100%;
    }
    @media screen and  (max-width: 600px){
        gap: 20px;
        grid-template-columns: repeat(2,1fr);
    }
    @media screen and  (max-width: 480px){
        gap: 10;
    }
}

.instagram__btnWrap {
    display: flex;
    justify-content: start;
    align-items: center;
    max-width: 250px;
    width: 100%;
    height: 60px;
}

.instagram__btn {
    width: 100%;
    height: 100%;
    background: #ffffff;
    border: 2px solid var(--themeColor);
    border-radius: 30px;
    color: var(--themeColor);
    font-family: var(--fontPrimary);
    font-weight: 400;
    font-size: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    transition: 0.2s;;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.instagram__btn:hover {
    background: #42956E;
    color: #ffffff;
    border-color: #42956E;
}

.instagram__btnIcoWrap {
    width: 30px;
    height: 30px;
    color: var(--themeColor);
    transition: 0.2s;
}

.instagram__btn:hover .instagram__btnIcoWrap {
    color: #ffffff;
}

.instagram__btnIco {
}

.instagram__feed {
    margin-top: 50px;
}

.instagram__swiper {
}

.swiper {
}

.instagram__swiperWrapper {
    transition-timing-function: linear;
}

.swiper-wrapper {
}

.instagram__swiperImgWrap {
    width: 300px;
    height: auto;
    @media screen and  (max-width: 767px){
        width: 280px;
    }
    @media screen and  (max-width: 600px){
        width: 240px;
    }
    @media screen and  (max-width: 480px){
        width: 200px;
    }
}

.swiper-slide {
}

.instagram__swiperImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ここまでinstagram */

/* ここからfaq */

.faq {
    margin-top: 200px;
    position: relative;
}

.faq__inner {
    position: relative;
    z-index: 10;
}

.inner {
}

.faq__bgText {
    position: absolute;
    top: -12%;
    left: -1.5%;
    font-family: var(--fontSecondary);
    font-size: clamp(5rem, 1.91rem + 13.15vw, 13.75rem);
    line-height: 0.95;
    color: #CFEBDD;
    white-space: nowrap;
    font-weight: 900;
    transform-origin: left top;
    z-index: 0;
    @media screen and  (max-width: 768px){
        top: -3%;
    }
}

.faq__ttlWrap {
    color: var(--themeColor);
}

.section__ttlWrap {
}

.faq__subTtl {
}

.section__subTtl {
}

.faq__ttl {
}

.section__ttl {
}

.faq__list {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.faq__item {
    background-color: #ffffff;
    transition: background-color 0.3s ease;
}

.faq__item.is-open {
    background-color: var(--themeColor);
}

.faq__question {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 20px 70px 20px 30px;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    color: var(--themeColor);
    transition: color 0.3s ease;
    @media screen and  (max-width: 768px){
        padding: 15px 50px 15px 20px;
    }
}

.faq__item.is-open .faq__question {
    color: #ffffff;
}

.faq__questionIco {
    flex-shrink: 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 16px;
    background-color: var(--themeColor);
    -webkit-mask: url("../img/ico_faq_pc_01.svg") no-repeat center / contain;
    mask: url("../img/ico_faq_pc_01.svg") no-repeat center / contain;
    transition: background-color 0.3s ease;
    @media screen and  (max-width: 768px){
        width: 22px;
        height: 22px;
        margin-right: 12px;
    }
}

.faq__item.is-open .faq__questionIco {
    background-color: #ffffff;
}

.faq__questionTxt {
    flex: 1;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.6;
}

.faq__question::before,
.faq__question::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 30px;
    width: 18px;
    height: 2px;
    background-color: var(--themeColor);
    transition: transform 0.3s ease, background-color 0.3s ease;
    @media screen and  (max-width: 768px){
        right: 25px;
    }
}

.faq__question::before {
    transform: translateY(-50%);
}

.faq__question::after {
    transform: translateY(-50%) rotate(90deg);
}

.faq__item.is-open .faq__question::before,
.faq__item.is-open .faq__question::after {
    background-color: #ffffff;
}

.faq__item.is-open .faq__question::after {
    transform: translateY(-50%) rotate(0);
    opacity: 0;
}

.faq__answer {
    overflow: hidden;
    max-height: 0;
    background-color: #ffffff;
    transition: max-height 0.3s ease;
    font-size: 1rem;
    font-weight: 400;
}

.faq__answerInner {
    padding: 20px 30px 30px 70px;
    @media screen and  (max-width: 768px){
        padding: 20px 20px 30px 50px;
    }
}

.faq__answerTxt {
    color: var(--subColor);
    font-size: 16px;
    line-height: 1.8;
}

/* ここまでfaq */

/* ここからcta */

.cta {
    margin-top: 150px;
    background: var(--themeColor);
    border-radius: 20px;
    max-width: 1200px;
    width: calc(355 / 375 * 100vw);
    height: auto;
    margin: 150px auto;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #f6f6f6;
    @media screen and  (max-width: 768px){
        margin: 125px auto;
    }
}

.cta__inner {
    max-width: 1000px;
    width: calc(355 / 375 * 100vw);
    height: 100%;
    margin: auto;
    padding: 50px 20px;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 25px;
    position: relative;
    z-index: 20;
}

.cta__ttlWrap {
    align-items: start;
}

.cta__subTtl {
    color: #179E5F;
}

.section__subTtl {
}

.cta__ttl {
    color: #ffffff;
}

.section__ttl {
    line-height: 1.4;
}

.cta__lead {
    color: #ffffff;
    font-size: 1rem;
    font-weight: 400;
    font-family: var(--fontPrimary);
    line-height: 1.6;
}

.cta__leadBr {
    @media screen and  (max-width: 767px){
        display: none;
    }
}

.cta__btnWrap {
    max-width: 300px;
    width: 100%;
    height: 60px;
    margin-top: 25px;
}

.cta__btn {
    width: 100%;
    height: 100%;
    background: #ffffff;
    border-radius: 30px;
    font-size: 1.25rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
    color: var(--themeColor);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.2s;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.cta__btn:hover {
    background: #cccccc;
}

.cta__btn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.cta__btn:hover::after {
    right: 15px;
}

.cta__decorationLogoWrap {
    position: absolute;
    right: 50px;
    top: 0;
    bottom: 0;
    height: 289px;
    margin: auto;
    @media screen and  (max-width: 480px){
        right: 0;
        left: 0;
        height: 100%;
        width: auto;
    }
}

.cta__decorationLogo {
    mix-blend-mode: multiply;
}

/* ここまでcta */

/* ここからpartners */

.partners {
    background: #6f6f6f;
    padding-top: 100px;
    border-radius: 60px 60px 0 0;
    border-bottom: 1px solid #6f6f6f;
}

.partners__inner {
    padding-bottom: 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.partners__ttlWrap {
    align-items: center;
}

.partners__subTtl {
    color: #A4A4A4;
}

.section__subTtl {
}

.partners__ttl {
    color: #ffffff;
}

.section__ttl {
}

.partners__list {
    width: 100%;
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.partners__item {
    max-width: 240px;
    width: 100%;
    height: auto;
    background: #ffffff;
    border: 2px solid #000000;
    border-radius: 10px;
    padding: 15px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.partners__itemImgWrap {
    width: 90px;
    height: auto;
}

.partners__itemImg {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.partners__itemCompanyName {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    color: var(--themeColor);
    font-weight: 450;
    margin-top: 20px;
}

.partners__itemLinkWrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.partners__itemLink {
    font-family: var(--fontPrimary);
    font-size: 0.875em;
    color: var(--themeColor);
    font-weight: 450;
    margin-top: 5px;
    text-decoration: underline;
    text-underline-offset: 0.1rem;
}

.partners__lead {
    font-size: 1.125rem;
    line-height: 1.6;
    font-weight: 400;
    color: #ffffff;
    font-family: var(--fontPrimary);
    margin-top: 50px;
    text-align: center;
    @media screen and  (max-width: 767px){
        font-size: 1rem;
        font-weight: 400;
    }
}

.partners__leadBr {
}

.partners__btnWrap {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 50px;
}

.partners__btn {
    width: 300px;
    height: 60px;
    background: #858585;
    border: 2px solid #ffffff;
    border-radius: 30px;
    color: #ffffff;
    font-size: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s;
    position: relative;
    font-family: var(--fontPrimary);
    font-weight: 400;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.partners__btn:after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: #ffffff;
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.partners__btn:hover::after {
    background-color: #dfdfdf;
    right: 15px;
}

.partners__btn:hover {
    background: var(--themeColor);
    border-color: #dfdfdf;
    color: #dfdfdf;
}

/* ここまでpartners */

/* ここまでmain */

/* ここからfooter */

.footer {
    background: #6f6f6f;
    border-top: 1px solid #6f6f6f;
    padding-bottom: 30px;
}

.footer__inner {
    padding-top: 50px;
    border-top: 2.5px solid var(--subColor);
}

.inner {
}

.footer__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer__headLeft {
    display: flex;
    align-items: center;
    gap: 50px;
    @media screen and  (max-width: 960px){
        gap: 25px;
    }
}

.footer__logoWrap {
    width: 257px;
    height: 60px;
}

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

.footer__snsIcoLink {
    width: 30px;
    height: 30px;
    display: none;
}

.footer__snsIco {
}

.footer__headRight {
    display: flex;
    justify-content: end;
    width: 100%;
    @media screen and  (max-width: 767px){
        display: none;
    }
}

.footer__headCtaBtnWrap {
    max-width: 300px;
    width: 100%;
    height: 60px;
}

.footer__headCtaBtn {
    width: 100%;
    height: 100%;
    background: #858585;
    border: 2px solid #ffffff;
    border-radius: 30px;
    color: #ffffff;
    font-size: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s;
    position: relative;
    font-family: var(--fontPrimary);
    font-weight: 400;
    @media screen and  (max-width: 600px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.footer__headCtaBtn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: #ffffff;
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.footer__headCtaBtn:hover::after {
    background-color: #dfdfdf;
    right: 15px;
}

.footer__headCtaBtn:hover {
    background: var(--themeColor);
    border-color: #dfdfdf;
    color: #dfdfdf;
}

.footer__content {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-top: 25px;
    gap: 50px;
    @media screen and  (max-width: 960px){
        gap: 30px;
    }
    @media screen and  (max-width: 767px){
        flex-direction: column;
    }
}

.footer__brand {
    width: 300px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    @media screen and  (max-width: 767px){
        flex-direction: row;
        width: 100%;
    }
    @media screen and  (max-width: 767px){
        flex-direction: column;
    }
}

.footer__desc {
    font-family: var(--fontPrimary);
    font-size: 0.75rem !important;
    color: #ffffff;
    line-height: 1.4;
    font-weight: 400;
    @media screen and  (max-width: 767px){
        width: 300px;
    }
    @media screen and  (max-width: 767px){
        width: 100%;
    }
}

.footer__address {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    gap: 10px;
}

.footer__addressItem {
    display: flex;
    justify-content: start;
    align-items: start;
    gap: 10px;
    height: auto;
    font-size: 1rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
    color: #ffffff;
}

.footer__addressItem--link {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.footer__addressItemIcoWrap--post {
    width: 22px;
    height: 22px;
    display: flex;
    flex-shrink: 0;
}

.footer__addressItemIco--post {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* .footer__addressItemIcoWrap--phone {
}

.footer__addressItemIco--phone {
} */

.footer__addressItemIcoWrap--mail {
}

.footer__addressItemIco {
}

.footer__addressItemLink {
}

.footer__nav {
    width: auto;
    @media screen and  (max-width: 767px){
        width: 100%;
    }
}

.footer__navGroup {
    display: flex;
    gap: 50px;
    width: 100%;
    @media screen and  (max-width: 960px){
        gap: 30px;
    }
    @media screen and  (max-width: 480px){
        gap: 20px;
    }
}

.footer__navList {
    width: 225px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    @media screen and  (max-width: 600px){
        width: 100%;
        min-width: 0;
        flex: 1;
    }
}

.footer__navItem {
}

.footer__navItem::after {
}

.footer__navItemLink {
    color: #ffffff;
    width: 98%;
    font-size: 1rem;
    font-weight: 400;
    font-family: var(--fontPrimary);
    display: block;
    position: relative;
    transition: 0.2s all;
    @media screen and  (max-width: 480px){
        font-size: 0.875rem;
    }
}

.footer__navItemLink::after {
    content: url(../img/ico_footer_navArrow_pc_01.svg);
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.footer__navItemLink:hover {
    opacity: 0.7;
    width: 100%;
}

.footer__navItemLink--sub {
    position: relative;
    padding-left: 30px;
}

.footer__navItemLink--sub::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 15px;
    height: 1px;
    background: #ffffff;

}

.footer__pageTopBody {
    height: auto;
    margin-top: auto;
    display: flex;
    justify-content: end;
    align-items: end;
    @media screen and  (max-width: 767px){
        width: 100%;
        justify-content: space-between;
        align-items: center;
    }
}

.footer__contactBtnWrap {
    max-width: 300px;
    width: 100%;
    height: 60px;
    display: none;
    @media screen and  (max-width: 767px){
        display: block;
    }
}

.footer__contactBtn {
    width: 100%;
    height: 100%;
    background: #858585;
    border: 2px solid #ffffff;
    border-radius: 30px;
    color: #ffffff;
    font-size: 1.25rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    @media screen and  (max-width: 767px){
        font-size: 1.125rem;
        width: 240px;
        height: 50px;
    }
    @media screen and  (max-width: 480px){
        font-size: 1rem;
    }
    @media screen and  (max-width: 375px){
        width: 220px;
    }
}

.footer__contactBtn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: #ffffff;
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
    @media screen and  (max-width: 375px){
        right: 15px;
    }
}

.footer__contactBtn:hover::after {
    background-color: #dfdfdf;
    right: 15px;
    @media screen and  (max-width: 375px){
        right: 10px;
    }
}

.footer__contactBtn:hover {
    background: var(--themeColor);
    border-color: #dfdfdf;
    color: #dfdfdf;
}

.footer__pageTop {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    @media screen and  (max-width: 767px){
        padding-right: 10px;
    }
}

.pageTop__icoBody {
    width: 60px;
    height: 60px;
    background: #858585;
    border: 2px solid #ffffff;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.2s;
    @media screen and  (max-width: 600px){
        width: 50px;
        height: 50px;
    }
}

.footer__pageTop:hover .pageTop__icoBody{
    background: var(--themeColor);
    border-color: #dfdfdf;
}

.pageTop__IcoWrap {
    margin-top: -8px;
    transition: 0.2s;
    color: #ffffff;
}

.footer__pageTop:hover .pageTop__IcoWrap {
    transform: translateY(-5px);
    color: #dfdfdf;
}

.pageTop__ico {
    width: 20px;
    height: 10px;
}

.pageTop__text {
    font-size: 1.25em;
    font-weight: 500;
    color: #ffffff;
    line-height: 1.3;
    white-space: nowrap;
    font-family: var(--fontSecondary);
    transition: 0.2s;
    @media screen and  (max-width: 600px){
        font-size: 1rem;
    }
}

.footer__pageTop:hover .pageTop__text {
    color: #dfdfdf;
}

.footer__bottom {
    display: flex;
    margin-top: 75px;
    justify-content: space-between;
    align-items: center;
    @media screen and  (max-width: 767px){
        flex-direction: column;
        gap: 25px;
        margin-top: 50px;
    }
    @media screen and  (max-width: 600px){
        align-items: start;
        margin-top: 30px;
    }
}

.footer__bottomLeft {
    display: flex;
    gap: 50px;
    font-size: 1rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
    color: #ffffff;
    @media screen and  (max-width: 767px){
        justify-content: space-between;
        gap: 20px;
        font-size: 0.875rem;
    }
    @media screen and  (max-width: 600px){
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 10px;
        justify-content: start;
    }
    @media screen and  (max-width: 480px){
        grid-template-columns: repeat(1,1fr);
        gap: 15px;
    }
}

.footer__bottomTerms {
    transition: 0.2s all;
}

.footer__bottomTerms:hover {
    opacity: 0.7;
}

.footer__bottomPrivacy {
    transition: 0.2s all;
}

.footer__bottomPrivacy:hover {
    opacity: 0.7;
}

.footer__bottomRight {
    @media screen and  (max-width: 600px){
        width: 100%;
        display: flex;
        justify-content: center;
    }
}

.footer__bottomCopyright {
    color: #ffffff;
    font-size: 0.875rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
}

.footer__bottomCopyrightSmall {
}

/* ここまでfooter */

/* ここからチーム紹介ページ */

.main {
}

.intro {
}

/* ここからチーム紹介ページのmv */

.intro__mv {
    background: url(../img/mv_intro_pc_01.jpg) center center / cover;
    height: 370px;
    width: 1200px;
    max-width: calc(355/375 * 100vw);
    margin: 150px auto 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 40px;
    text-align: center;
    @media screen and  (max-width: 767px){
        margin-top: 130px;
    }
}

.intro_mvTtl {
}

.mv__ttl {
    font-size: 3.375rem;
    font-family: var(--fontPrimary);
    color: #ffffff;
    @media screen and  (max-width: 960px){
        font-size: 2.625rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 2rem;
    }
}

/* ここからチーム紹介ページのfeature */

.intro__feature {
    margin-top: 100px;
    @media screen and  (max-width: 768px){
        margin-top: 75px;
    }
}

.feature__inner {
}

.feature__ttlWrap {
    align-items: start;
}

.section__ttlWrap {
}

.section__ttlWrap--border {
    position: relative;
    padding-bottom: 10px;
    align-items: start;
}

.section__ttlWrap--border::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #a4a4a4;
}

.section__ttlWrap--border::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200px;
    height: 4px;
    background: var(--themeColor);
}

.feature__subTtl {
    color: var(--themeColor);
}

.section__subTtl {
}

.feature__ttl {
    color: var(--subColor);
}

.section__ttl {
}

.feature__list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 25px;
    margin-top: 50px;
    @media screen and  (max-width: 767px){
        grid-template-columns: repeat(1,1fr);
    }
}

.feature__item {
    border-radius: 20px;
    padding: 20px;
    background: #ffffff;
    border: 2px solid var(--themeColor);
}

.feature__itemTtl {
    font-size: 1.25rem;
    padding-left: 15px;
    height: 48px;
    display: flex;
    align-items: center;
    font-family: var(--fontPrimary);
    position: relative;
    @media screen and  (max-width: 767px){
        font-size: 1.125rem;
    }
}

.feature__itemTtl::before {
    content: "";
    position: absolute;
    width: 4px;
    height: 100%;
    background: var(--themeColor);
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-radius: 2px;
}

.feature__itemImgWrap {
    border-radius: 20px;
    overflow: hidden;
    margin-top: 15px;
}

.feature__itemImg {
}

.feature__itemBody {
    margin-top: 30px;
    @media screen and  (max-width: 767px){
        margin-top: 20px;
    }
}

.feature__itemText {
    font-size: 1rem;
    line-height: 1.6;
    font-family: var(--fontPrimary);
    @media screen and  (max-width: 767px){
        font-size: 0.875rem;
        line-height: 1.4;
    }
}

.feature__itemTextBr {
}

/* ここまでチーム紹介ページのfeature */

/* ここからチーム紹介ページのcta */

.intro__cta {
    margin-top: 150px;
    height: 250px;
    background: url(../img/img_intro_cta_pc_01.jpg) center center / cover;
    @media screen and  (max-width: 768px){
        margin-top: 100px;
    }
}

.introCta__inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.introCta__text {
    font-size: 1.5rem;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fontPrimary);
    text-align: center;
    line-height: 1.4;
    @media screen and  (max-width: 767px){
        font-size: 1.25rem;
        font-weight: 400;
    }
    @media screen and  (max-width: 480px){
        font-size: 1rem;
    }

}

.introCta__btnWrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.introCta__btn {
    width: 250px;
    height: 60px;
    background: #ffffff;
    border-radius: 30px;
    font-family: var(--fontPrimary);
    color: var(--themeColor);
    font-size: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.2s;
    @media screen and  (max-width: 767px){
        width: 200px;
        height: 50px;
        font-size: 1rem;
    }
}

.introCta__btn:hover {
    background: #42956E;
    color: #ffffff;
}

.introCta__btn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.introCta__btn:hover::after {
    background-color: #ffffff;
    right: 15px;
}

/* ここまでチーム紹介ページのcta */

/* ここからチーム紹介ページのstaff */

.intro__staff {
    margin-top: 150px;
    margin-bottom: 100px;
    @media screen and  (max-width: 768px){
        margin-top: 100px;
        margin-bottom: 75px;
    }
}

.staff__inner {
}

.staff__ttlWrap {
    align-items: start;
}

.section__ttlWrap--border {
}

.staff__subTtl {
    color: var(--themeColor);
}

.staff__ttl {
    color: var(--subColor);
}

.staff__list {
    margin-top: 50px;
}

.staff__item {
    display: flex;
    gap: 50px;
    align-items: start;
    padding: 40px 40px 40px 40px;
    border-bottom: 2.5px solid var(--themeColor);
    @media screen and  (max-width: 767px){
        padding: 20px;
    }
    @media screen and  (max-width: 480px){
        flex-direction: column-reverse;
        gap: 20px;
        padding: 30px 20px;
    }
}

.staff__item:first-child {
    padding-top: 0;
}

.staff__itemImgWrap {
    width: 300px;
    height: 300px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
    @media screen and  (max-width: 767px){
        width: 250px;
        height: 250px;
    }
    @media screen and  (max-width: 600px){
        width: 200px;
        height: 200px;
    }
    @media screen and  (max-width: 480px){
        width: 100%;
        height: auto;
    }
}

.staff__itemImg {
}

.staff__itemBody {
    color: var(--subColor);
    font-family: var(--fontPrimary);
}

.staff__itemRole {
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1.4;
    @media screen and  (max-width: 767px){
        font-size: 1.25rem;
    }
}

.staff__itemName {
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.4;
    @media screen and  (max-width: 767px){
        font-size: 1.75rem;
    }
}

.staff__itemDesc {
    font-size: 1rem;
    font-weight: 500;
    margin-top: 15px;
}

/* ここまでチーム紹介ページのstaff */

/* ここからチーム紹介ページのpractice */

.intro__practice {
    padding-top: 100px;
    @media screen and  (max-width: 768px){
        margin-top: 50px;
    }
}

.practice__inner {
}

.practice__ttlWrap {
    align-items: start;
}

.section__ttlWrap--border {
}

.practice__subTtl {
    color: var(--themeColor);
}

.practice__ttl {
    color: var(--subColor);
}

.practice__list {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.practice__item {
    display: flex;
    gap: 50px;
    align-items: start;
    @media screen and  (max-width: 767px){
        flex-direction: column-reverse;
        gap: 20px;
    }
}

.practice__itemMap {
    max-width: 575px;
    width: 100%;
    height: 335px;
    @media screen and  (max-width: 767px){
        max-width: 100%;
    }
}

.practice__itemBody {
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-items: start;
    justify-content: start;
    font-family: var(--fontPrimary);
}

.practice__itemName {
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.4;
    @media screen and  (max-width: 767px){
        font-size: 1.75rem;
    }
}

.practice__itemDl {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.practice__itemInfo {
    display: flex;

}

.practice__itemDt {
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--subColor);
    position: relative;
    line-height: 1.4;
    width: 95px;
    padding-right: 30px;
    flex-shrink: 0;
    @media screen and  (max-width: 767px){
        font-size: 1.125rem;
    }
}

.practice__itemDt::after {
    content: "：";
    position: absolute;
    right: 0;
    top: -3px;
    font-size: 1.25em;
    color: var(--subColor);
}

.practice__itemDd {
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--subColor);
    line-height: 1.4;
    margin-left: 10px;
    @media screen and  (max-width: 767px){
        font-size: 1.125rem;
    }
}

.practice__itemDdBr {
}

/* ここまでチーム紹介ページのpractice */

/* ここまでチーム紹介ページ */

/* ここからお問い合わせページ */

.is-hidden {
    display: none !important;
}

.contact__inner {
    padding-top: 125px;
    @media screen and  (max-width: 768px){
        padding-top: 100px;
    }
    @media screen and  (max-width: 480px){
        padding-top: 75px;
    }
}

.contact {
    margin: 175px auto;
    width: 1000px;
    max-width: calc(355 / 375 * 100vw);
    background: #ffffff;
    border-radius: 20px;
    @media screen and  (max-width: 767px){
        margin-top: 150px;
    }
}

.contactFrom__inner {
    width: 800px;
    max-width: calc(320 / 375 * 100vw);
    margin: auto;
    padding: 75px 0;
}

.contact__ttlWrap {
    align-items: start;
}

.contact__subTtl {
    color: var(--themeColor);
}

.contact__ttl {
    color: var(--subColor);
    text-align-last: left;
}

.contact__lead {
    margin-top: 25px;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
}

.contact__leadBr {
}

.contact__form {
    margin-top: 75px;
}

/* スパムボット対策 */

.form__honeypot {
    opacity: 0;
    position: absolute;
    top: -9999px;
    left: -9999px;
    z-index: -1;
    pointer-events: none; 
}

.form__section {
    display: flex;
    min-width: 0;
    align-items: start;
    gap: 50px;
    @media screen and  (max-width: 767px){
        flex-direction: column;
        gap: 25px;
    }
}

.form__field {
    display: flex;
    align-items: start;
    width: 100%;
    height: 100%;
    margin-top: 50px;
    gap: 50px;
    @media screen and  (max-width: 767px){
        flex-direction: column;
        gap: 25px;
    }
}

.form__labelWrap {
    width: 240px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
}

.form__required {
    background: var(--themeColor);
    color: #ffffff;
    font-family: var(--fontPrimary);
    font-size: 0.625rem;
    font-weight: 400;
    padding: 3px 6px 4px;

}

.form__required--gray {
    background: #929292;
}

.form__label {
    font-size: 1rem;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    font-weight: 400;
    display: block;
    flex-shrink: 0;
    line-height: 2;
}

.form__radioGroup {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.form__radioLabel {
    position: relative;
    padding-left: 44px;
    font-size: 1rem;
    color: var(--subColor);
    display: block;
    min-height: 26px;
    cursor: pointer;
}

.form__radioInput {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.form__radioText::before, .form__radioText::after {
    content: "";
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
}

.form__radioText::before {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #F9F7F2;
    border: 1px solid var(--themeColor);
    left: 0;
}

.form__radioText::after {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--themeColor);
    top: 50%;
    left: 7px;
    transform: translateY(-50%) scale(0);
}

.form__radioInput:checked + .form__radioText::after {
    transform: translateY(-50%) scale(1);
}

.form__radioText {
}

.form__group {
    display: flex;
    flex-direction: column;
}

.js-form-group {
}

.form__input {
    background: #f9f7f2;
    border: 1px solid var(--themeColor);
    width: 100%;
    height: 30px;
    padding: 5px 10px;
    border-radius: 5px;
}

.form__input--grade {
    max-width: 240px;
    width: 100%;
}

.js-message-label {
    display: flex;
}

.form__textarea {
    max-width: 570px;
    width: 100%;
    height: 200px;
    background: #f9f7f2;
    border: 1px solid var(--themeColor);
    padding: 10px;
    border-radius: 5px;
}

/* エラー時の入力欄の枠線を赤くする */
.form__input.is-error,
.form__textarea.is-error {
    border-color: #E60012;
    background-color: #FFF5F5; /* 背景もほんのり赤くするとより分かりやすいです */
    transition: 0.3s;
}

.form__errorText {
    color: #E60012;
    font-size: 0.875rem;
    margin-top: 5px;
    display: flex;
    flex-shrink: 0;
}

.form__policy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
}

.form__policyLabel {
}

.form__policyInput {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.form__policyText {
    font-size: 1rem;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    position: relative;
    padding-left: 35px;
    cursor: pointer;
}

.form__policyText::before {
    content: "";
    position: absolute;
    width: 26px;
    height: 26px;
    background: #F9F7F2;
    border: 1px solid var(--themeColor);
    border-radius: 3px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.form__policyText::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 10px;
    border-left: 2px solid var(--themeColor);
    border-bottom: 2px solid var(--themeColor);
    top: 42%;
    left: 5px;
    transform: translateY(-50%) rotate(-45deg) scale(0);
}

.form__policyInput:checked + .form__policyText::after {
    transform: translateY(-50%) rotate(-45deg) scale(1);
}

.form__policyLink {
    color: var(--themeColor);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: 0.2s all;
}

.form__policyLink:hover {
    color: #42956E;
}

.form__btnWrap {
    max-width: 270px;
    width: 100%;
    height: 60px;
    margin: 75px auto 0;
}

.form__btn {
    width: 100%;
    height: 100%;
    background: #f9f7f2;
    border: 2px solid var(--themeColor);
    border-radius: 30px;
    color: var(--themeColor);
    font-size: 1.25rem;
    font-family: var(--fontPrimary);
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    @media screen and  (max-width: 767px){
        font-size: 1.125rem;
        font-weight: 400;
    }
}

.form__btn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.form__btn:hover {
    background: var(--themeColor);
    color: #ffffff;
    transition: 0.2s;
}

.form__btn:hover::after {
    background-color: #ffffff;
    right: 15px;
}

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

.form__thanksContent {
    display: flex;
    flex-direction: column;
}

.form__thanksTtl {
    font-size: 2rem;
    font-family: var(--fontPrimary);
    color: var(--themeColor);
    font-weight: 500;
    text-align: center;
    font-family: var(--fontPrimary);
}

.form__thanksText {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
    color: var(--subColor);
    font-family: var(--fontPrimary);
    margin: 25px auto 50px;
}

.form__thanksTextBr {
    @media screen and  (max-width: 480px){
        display: none;
    }
}

.form__checkBtnWrap {
    display: flex;
    justify-content: center;
    max-width: 565px;
    width: 100%;
    margin: auto;
    gap: 25px;
    margin-top: 75px;
    @media screen and  (max-width: 600px){
        margin-top: 50px;
        flex-direction: column;
        gap: 25px;
    }
}

/* 確認画面のタイトル・リード文 */
.form__confirmTtl {
    font-family: var(--fontPrimary);
    color: var(--themeColor);
    font-size: 1.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: 20px;
    font-weight: bold;
}

.form__confirmLead {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
    margin-bottom: 20px;
}

/* 入力されたテキストの表示用 */
.form__confirmText {
    font-family: var(--fontPrimary);
    font-size: 1rem;
    font-weight: 400;
    color: var(--subColor);
    line-height: 1.6;
    width: 100%;
    word-break: break-all; /* 長いURL等でレイアウト崩れを防ぐ */
}

/* 確認画面のボタンエリア（横並びにする） */

/* 「修正する」ボタンの調整 */
.form__btn--back {
    background: #ffffff;
    color: var(--subColor);
    border-color: #ccc;
}

.form__btn--back:hover {
    background: #f0f0f0;
    color: var(--subColor);
}

/* 「修正する」ボタンには矢印アイコンを出さない（または別のアイコンにする）ためのリセット */
.form__btn--back::after {
    display: none;
}

/* スマホ表示時のボタン縦並び調整 */
@media screen and (max-width: 767px) {
    .form__btnWrap--confirm {

    }
    /* 最後の項目とボタンの間の余白を調整 */
    .form__confirmList {
        margin-bottom: 50px;
    }
}

/* ここまでお問い合わせページ */

/* ここから利用規約のページ */

.main__terms--team {
}

.main__terms--academy {
}

.terms {
}

.terms__inner {
    margin-top: 75px;
    margin-bottom: 100px;
}

.terms__chapter {
    font-family: var(--fontPrimary);
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.5;
    margin-top: 50px;
    color: var(--subColor);
}

.terms__chapter + .terms__chapter {
    margin-top: 50px;
}

.terms__chapterBody {
    margin-top: 20px;
}

.terms__article {
}

.terms__article + .terms__article {
    margin-top: 40px;
}

.terms__articleTtl {
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1.5;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    margin-bottom: 5px;
}

.terms__articleText {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

.terms__list {

}

.terms__item {
    font-weight: 1rem;
    line-height: 1.5;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

/* ここまで利用規約のページ */

/* ここから個人情報保護法のページ */

.main__partner

.privacy {
}

.privacy__inner {
    margin-top: 75px;
    margin-bottom: 100px;
}

.privacy__lead {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

.privacy__article {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.privacy__articleTtl {
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1.5;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

.privacy__articleText {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

.privacy__articleList {
}

.privacy__articleItem {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    font-family: var(--fontPrimary);
    color: var(--subColor);
}

/* ここまで個人情報保護法のページ */

.partner {
}

.mv__ttl--partner {
    display: none;
    @media screen and  (max-width: 375px){
        display: block;
    }
}

.partner__inner {
    margin-top: 75px;
    margin-bottom: 100px;
}

.inner {
}

.partner__LeadWrap {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 100px;
}

.partner__leadTtl {
    font-family: var(--fontPrimary);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    font-weight: 500;
    color: var(--themeColor);
    line-height: 1.5;
    text-align: center;
    @media screen and  (max-width: 767px){
        font-size: 1.75rem;
    }
}

.partner__leadText {
    font-size: 1.25rem;
    line-height: 1.6;
    font-weight: 430;
    color: var(--subColor);
    font-family: var(--fontPrimary);
}

.partner__leadTextBr {
}

.partnerList__ttlWrap {
    align-items: start;
    padding-top: 75px;
    @media screen and  (max-width: 767px){
        padding-top: 0;
    }
}

.section__ttlWrap {
}

.section__ttlWrap--border {
}

.partnerList__subTtl {
    color: var(--themeColor);
}

.section__subTtl {
}

.partnerList__ttl {
}

.section__ttl {
}

.partner__list {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 50px;
    margin-bottom: 100px;
    @media screen and  (max-width: 960px){
        grid-template-columns: repeat(2,1fr);
    }
    @media screen and  (max-width: 767px){
        gap: 25px;
    }
    @media screen and  (max-width: 480px){
        grid-template-columns: repeat(1,1fr);
    }
}

.partner__item {
    width: 100%;
    background: #ffffff;
    border-radius: 20px;
    padding: 30px;
    border: 2px solid var(--themeColor);
    @media screen and  (max-width: 767px){
        padding: 20px;
    }
}

.partner__itemTtl {
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1.2;
    font-family: var(--fontPrimary);
    color: var(--subColor);
    border-bottom: 2px solid var(--themeColor);
    padding-bottom: 10px;
    @media screen and  (max-width: 767px){
        font-size: 1.25rem;
    }
}

.partner__itemText {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    color: var(--subColor);
    font-family: var(--fontPrimary);
    margin-top: 25px;
}

.partner__infoFlex {
    display: flex;
    gap: 100px;
    justify-content: center;
    padding-top: 75px;
    @media screen and  (max-width: 960px){
        gap: 50px;
    }
    @media screen and  (max-width: 767px){
        flex-direction: column;
        gap: 100px;
        padding-top: 0;
    }
}

.partner__infoPlan {
    width: 100%;
}

.partnerPlan__ttlWrap {
    align-items: start;
}

.partnerPlan__subTtl {
    color: var(--themeColor);
}

.partnerPlan__ttl {
}

.partnerPlan__contentBody {
    margin-top: 50px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.partnerPlan__content {
    display: flex;
    flex-direction: column;
}

.partnerPlan__contentText {
    font-family: var(--fontPrimary);
    font-size: 2rem;
    font-weight: 500;
    color: var(--subColor);
    line-height: 1.2;
    @media screen and  (max-width: 960px){
        font-size: 1.75rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 1.5rem;
    }
}

.partner__infoContact {
    width: 100%;
}

.partnerContact__ttlWrap {
    align-items: start;
}

.partnerContact__subTtl {
    color: var(--themeColor);
}

.partnerContact__ttl {
}

.partnerContact__content {
    display: flex;
    flex-direction: column;
    margin-top: 50px;
    font-family: var(--fontPrimary);
}

.partnerContact__contentText {
    font-family: var(--fontPrimary);
    font-size: 2rem;
    font-weight: 500;
    color: var(--subColor);
    line-height: 1.5;
    @media screen and  (max-width: 960px){
        font-size: 1.75rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 1.5rem;
    }
}

.partnerContact__contentText--large {
    font-size: 3rem;
    @media screen and  (max-width: 960px){
        font-size: 2.25rem;
    }
    @media screen and  (max-width: 767px){
        font-size: 1.75rem;
    }
}

.partnerContact__contentText--post {
    font-size: 1rem;
    margin-top: 25px;
}

.partnerContact__contentText--phone{
    font-size: 1.375rem;
}

.partnerContact__contentText--lead{
    margin-top: 25px;
    font-size: 1rem;
}

.partnerContact__contentBtnWrap {
    margin-top: 25px;
}

.partnerContact__contentBtn {
    width: 250px;
    height: 60px;
    background: #ffffff;
    border-radius: 30px;
    color: var(--themeColor);
    border: 2px solid var(--themeColor);
    font-size: 1.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.2s;
    @media screen and  (max-width: 767px){
        width: 200px;
        height: 50px;
        font-size: 1rem;
    }
}

.partnerContact__contentBtn:hover {
    background: #42956E;
    border-color: #42956E;
    color: #ffffff;
}

.partnerContact__contentBtn::after {
    content: "";
    position: absolute;
    -webkit-mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    mask-image: url(../img/ico_btn_arrow_pc_01.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--themeColor);
    width: 10.5px;
    height: 20px;
    right: 20px;
    top: 50%;
    transition: 0.2s;
    transform: translateY(-50%);
    @media screen and  (max-width: 767px){
        width: 8px;
        height: 16px;
    }
}

.partnerContact__contentBtn:hover::after {
    background-color: #ffffff;
    right: 15px;
}