/* @charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPMincho&display=swap');
@import url('../fonts/BagossStandard/stylesheet.css'); */
:root{
    --mincho:"BIZ UDPMincho", serif;
    --enFont:'Bagoss Standard TRIAL';

    --lightGreen:#BAEF4B;
    --mainText:#2F3631;
    --bgColor:#F4EEE5;
    --bgColor2:#D9DFDF;

    --hamidashi:95px;
    --asideLeft:clamp(15rem, -5rem + 25vw, 25rem);
    --discoverMgnTop:60px;
    @media (max-width:1280px){
        --asideLeft:clamp(0rem, -9rem + 30vw, 15rem);
    }
    @media (max-width:950px){
        --hamidashi:0;
    }
    @media (max-width:480px){
        --discoverMgnTop:40px;
    }

}
.mincho{
    font-family: var(--mincho);
}
.enFont{
    font-family: var(--enFont);
}
html{
    scroll-behavior: smooth;
    scroll-padding-top: 50px;
}
body{
    font-family: var(--enFont),dnp-shuei-gothic-gin-std, sans-serif;
	color: var(--mainText);
    background: var(--bgColor);
	letter-spacing: 0.05em;
    line-height: 1.6;
    overflow-x: clip;
}
/*BUTTON HOVER*/
.btn_more{
    width: auto;
    height: 50px;
    display: inline-flex;
    align-items: center;
    /* justify-content: space-between; */
    font-weight: 300;
    .turn_text{
        overflow: hidden;
        position: relative;
        line-height: 1.1;
        span{
            display: inline-block;
            &:nth-of-type(2){
                position: absolute;
                top: 0;
                left: 0;
                transform: translateY(101%);
                opacity: 0;
            }
        }
    }
    .arrow{
        margin-left: 20px;
        width: 45px;
        transition: all .4s ease-out;
        @media (max-width:480px){
            width: 35px;
        }
    }
    &:hover{
        .turn_text{
            span{
                &:nth-of-type(1){
                    animation: transformTop .6s forwards;
                    animation-name: transformTop;
                    animation-fill-mode: forwards;
                    animation-duration: .4s;
                    transition-timing-function: ease-out;
                }
                &:nth-of-type(2){
                    animation-name: transformBottom;
                    animation-fill-mode: forwards;
                    animation-duration: .4s;
                    transition-timing-function: ease-out;
                }
            }
        }
        .arrow{
            transform: rotate(-45deg);
        }
    }
}
@keyframes transformTop{
    0% {
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        transform: translateY(-100%);
        opacity: 0;
    }
}
@keyframes transformBottom{
    0% {
        transform: translateY(100%);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}
.btn_more:has(.telop_text){
    display: flex;
    align-items: center;
    overflow:hidden;
    white-space:nowrap;
    width: 110px;
    .telop_text{
        animation: flowing 10s linear infinite;
        transform:translateX(100%);
        span{
            display: inline-block;
            padding-right: 10px;
        }
    }
}
@keyframes flowing {
    0% { transform:translateX(0); }
    100% { transform:translateX(-100%); }
}

/*EN-TITLE*/
.js-target{
    .js-target_img{
        transition: all .3s ease-out;
        opacity: 0;
        transform: translateY(30%);
    }
    &.active{
        .js-target_img{
            opacity: 1;
            transform: translateY(0%);
        }
    }
}

/*ASIDE*/
.navi_menu{
    width: 240px;
    display: grid;
    height: 100svh;
    position: fixed;
    top: 0;
    z-index: 99;
    place-content: center;
    transition: all .5s ease;
    transform: translateX(-10%);
    opacity: 0;
    &.is_active{
        transform: translateX(0);
        opacity: 1;
        &.is_footer{
            transform: translateX(-10%);
            opacity: 0;
            visibility: hidden;
        }
    }
    .navi_menu_inner{
        .navi_menu_logo{
            width: 145px;
            margin-bottom: 50px;
            .navi_menu_logo_text{
                font-size: 12px;
            }
        }
        .navi_menu_box{
            margin-bottom: 50px;
            .navi_menu_list{
                .navi_menu_item{
                    @media (max-width:375px){
                        font-size: 14px;
                    }
                    &:not(:last-of-type){
                        margin-bottom: 30px;
                        @media (max-width:480px) {
                            margin-bottom: 1em;
                        }
                    }
                }
            }
        }
        .navi_menu_join{
            --width: 145px; /* 1文の表示の幅 */
            width: var(--width);
            overflow: hidden;
            line-height: 1;
            display: block;
            padding: 12px 0;
            border: 1px solid;
            border-radius: 30px;
            background-color: var(--lightGreen);
            .navi_menu_join_inner{
                display: inline-block;
                text-shadow: var(--width) 0 0 currentColor;
                animation-name: scrollingText;
                animation-duration: 3.5s;
                animation-timing-function: linear;
                animation-iteration-count: infinite;
            }
        }
    }
    .sp_visiable{
        display: none;
    }
    .navi_btn{
        display: none;
    }
    @media (max-width:820px){
        width: 100%;
        height: auto;
        display: block;
        transform: none;
        opacity: 1;
        .navi_btn{
            position: absolute;
            top: 0;
            transform: translateX(-50%);
            z-index: 999;
            text-align: center;
            display: block;
            width: 60px;
            height: 16px;
            opacity: 0;
            transition: all .3s ease;
            &.is_active{
                top: 35px;
                left: auto;
                right: 0;
                opacity: 1;
                ~ .sp_visiable{
                    .navi_btn_sub{
                        top: 30px;
                        opacity: 1;
                    }
                }
                &.is_footer{
                    top: 0;
                    opacity: 0;
                    ~ .sp_visiable{
                        .navi_btn_sub{
                            top: 0px;
                            opacity: 0;
                        }
                    }
                }
            }
            .navi_btn_check{
                width: 11px;
                height: 11px;
                display: inline-block;
                position: absolute;
                top: 50%;
                left: 0;
                transform: translateY(-50%);
                border-radius: 50%;
                background: var(--lightGreen);
                border: 1px solid;
                transition: all .3s ease;
            }
            .navi_btn_status{
                font-weight: 300;
                font-size: 14px;
                position: relative;
                display: inline-block;
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                width: 40px;
                transition: all .3s ease;
                &.is_menu{
                    right: 0;
                    opacity: 1;
                }
                &.is_close{
                    left: -30px;
                    opacity: 0;
                }
            }
        }
        .navi_menu_inner{
            width: 100%;
            overflow: clip;
            overflow-y: scroll;
            height: calc(100svh - 10px);
            padding:80px 20px 40px;
            border-radius: 0 0 35px 35px;
            border-bottom: 1px solid;
            border-left: 1px solid;
            border-right: 1px solid;
            position: fixed;
            top: -10%;
            opacity: 0;
            background: #CEF778;
            transition: all .3s ease;
            z-index: 998;
            pointer-events: none;
            .navi_menu_join{
                display: none;
            }
        }
        .sp_visiable{
            display: block;
            .recruit-footer{
                height: auto;
                .recruit-footer_inner{
                    height: auto;
                    .recruit-footer_inner_contain{
                        grid-template-rows: auto;
                        padding: 0;
                        .recruit-footer_inner_navi{
                            grid-template-rows: auto;
                            grid-row: 1;
                            .recruit-footer_inner_navi_box:nth-of-type(2){
                                margin-left: auto;
                            }
                        }
                    }
                }
            }
            .navi_menu_join_footer{
                --widthNavi: 820px; /* 1文の表示の幅 */
                @media (max-width:480px){
                    --widthNavi: 700px;
                }
                width: var(--widthNavi);
                width: 100vw;
                margin: 0 calc(50% - 50vw);
                font-size: 90px;
                color: #A0C4C4;
                overflow: hidden;
                line-height: 1;
                display: block;
                padding: 15px 0;
                font-weight: 300;
                white-space: nowrap;
                .navi_menu_join_footer_inner{
                    display: inline-block;
                    text-shadow: var(--widthNavi) 0 0 currentColor;
                    animation-name: scrollingTextNavi;
                    animation-duration: 3.8s;
                    animation-timing-function: linear;
                    animation-iteration-count: infinite;
                }
            }
            .navi_menu_line{
                text-align: right;
                .btn_more{
                    font-size: 12px;
                    background: #fff;
                    border-radius: 30px;
                    border: 1px solid;
                    padding: 10px 1em;
                    height: auto;
                    .turn_text{
                        .lineicon{
                            width: 18px;
                            display: inline-block;
                        }
                    }
                }
            }
        }
        .navi_btn_sub{
            display: flex;
            justify-content: space-between;
            position: fixed;
            top: 0;
            opacity: 0;
            transition: all .3s ease;
            width: 100%;
            padding: 0 20px;
            z-index: 997;
            .btn_more{
                font-size: 12px;
                background: #fff;
                border-radius: 30px;
                border: 1px solid;
                padding: 5px 1em;
                height: 30px;
                line-height: 30px;
                &:nth-of-type(2){
                    background: var(--lightGreen)
                }
                .telop_text{
                    .lineicon{
                        width: 18px;
                        display: inline-block;
                        vertical-align: middle;
                    }
                }
            }
        }
        #navi-toggle:checked ~ .navi_menu_inner{
            top: 0%;
            opacity: 1;
            pointer-events: all;
        }
        #navi-toggle:checked ~ .navi_btn{
            .navi_btn_check{
                background: #fff;
                left: 50px;
            }
            .navi_btn_status{
                &.is_menu{
                    right: -30px;
                    opacity: 0;
                }
                &.is_close{
                    left: 0;
                    opacity: 1;
                }
            }
        }
    }
}
@keyframes scrollingText {
    0% {
      translate: 0 0;
    }
    100% {
      translate: calc(var(--width) * -1) 0;
    }
}
@keyframes scrollingTextNavi {
    0% {
      translate: 0 0;
    }
    100% {
      translate: calc(var(--widthNavi) * -1) 0;
    }
}


/*TOP*/
#mv{
.swiper{
    overflow: clip;
    overflow-y: visible;
}
/* スライドの動き等速 */
.swiper-wrapper {
transition-timing-function: linear;
}
/* 画像のサイズ調整 */
.swiper-slide img {
height: auto;
width: 100%;
}
.swiper-slide {
    margin-top: 30px;
}

.swiper-slide[data-swiper-slide-index='0'],
.swiper-slide[data-swiper-slide-index='3']{
    margin-top: 30px;
}
.swiper-slide[data-swiper-slide-index='1'],
.swiper-slide[data-swiper-slide-index='4']{
    margin-top: -30px;
}
.swiper-slide[data-swiper-slide-index='2'],
.swiper-slide[data-swiper-slide-index='5']{
    margin-top: 100px;
}
}

/***************************************************
* Generated by SVG Artista on 11/13/2024, 5:45:30 PM
* MIT license (https://opensource.org/licenses/MIT)
* W. https://svgartista.net
**************************************************/

svg .svg-elem-1 {
    stroke-dashoffset: 621.8447265625px;
    stroke-dasharray: 621.8447265625px;
    -webkit-transition: stroke-dashoffset 1.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
            transition: stroke-dashoffset 1.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
}

svg.active .svg-elem-1 {
    stroke-dashoffset: 0;
}

svg .svg-elem-2 {
    stroke-dashoffset: 384px;
    stroke-dasharray: 384px;
    -webkit-transition: stroke-dashoffset 1.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s;
            transition: stroke-dashoffset 1.5s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s;
}

svg.active .svg-elem-2 {
    stroke-dashoffset: 0;
}

.header_slide{
    position: relative;
    @media (max-width:480px){
        /* height: 80svh; */
    }
    .header_text{
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 2;
        .header_text_inner{
            position: absolute;
            width: 100%;
            top:70%;
            left: 50px;
            transform: translateY(-50%);
            @media (max-width:480px){
                left: 10px;
            }
            .header_text_box{
                line-height: 1.0;
                .fade_animation_mv {
                    overflow: hidden;
                }
                .fade_animation_mv_text {
                    transform: translateY(120%);
                    display: inline-block;
                }
                .enFont{
                    color:var(--lightGreen);
                    font-size: clamp(3.125rem, 2.314rem + 4.05vw, 6.875rem);
                    font-weight: 300;
                    vertical-align: text-bottom;
                    &:nth-of-type(2){
                        padding-bottom: 10px;
                    }
                }
            } 
            .mincho{
                font-size: clamp(1.125rem, 0.989rem + 0.68vw, 1.5rem);
                margin-top: 15px;
                position: relative;
                span{
                    position: relative;
                    z-index: 1;
                }
                .pen-circle{
                    position: absolute;
                    width:clamp(8.125rem, 7.855rem + 1.35vw, 9.375rem);
                    top: 50%;
                    left: -20px;
                    transform: translateY(-50%);
                    rotate: -2deg;
                    z-index: 0;
                }
            } 
        }
    }
}
.wrapper{
    padding-left: var(--asideLeft);
    position: relative;
    @media (max-width:480px){
    }
}
.news{
    padding: 5% 0;
    .news_inner{
        margin: auto;
        max-width: 1180px;
        width: 90%;
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        @media (max-width:768px){
            display: block;
        }
        .news_list{
            width: 100%;
            height: 50px;
            @media (max-width:480px){
                height: 140px;
            }
            .news_list_item{
                display: flex;
                align-items: center;
                @media (max-width:480px){
                    display: block;
                }
                .news_date{
                    padding-right: 50px;
                }
                .news_title{
                    font-weight: 400;
                    overflow: hidden;
                    a{
                        text-decoration: underline;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 1;
                    }
                    @media (max-width:480px){
                        a{
                            -webkit-line-clamp: 2;
                        }
                    }
                }
                .news_link{
                    margin-left: auto;
                    @media (max-width:768px){
                        text-align: right;
                    }
                    .btn_more{
                        .turn_text{
                            white-space: nowrap;
                        }
                    }
                }
            }
        }
    }
}

.message{
    padding: 5% 0 15%;
    /* position: relative; */
    .message_inner{
        max-width: 1180px;
        width: 90%;
        display: flex;
        flex-wrap: wrap;
        margin: auto;
        position: relative;
        z-index: 1;
        @media (max-width:480px){
            display: block;
        }
        .message_title{
            width: 50%;
            padding-left: 70px;
            @media (max-width:950px){
                padding-left: 0;
            }
            @media (max-width:480px){
                width: 100%;
                padding-left: 0px;
                margin-bottom: 30px;
            }
            .message_title_text{
                width: clamp(14.375rem, 13.834rem + 2.7vw, 16.875rem);
            }
            .mincho{
                position: relative;
                display: inline-block;
                font-size: 20px;
                margin-top: 30px;
                margin-left: 65px;
                @media (max-width:950px){
                    margin-left: 0px;
                    padding-left: 65px;
                }
                span{
                    position: relative;
                    z-index: 1;
                }
                .pen-circle{
                    position: absolute;
                    width:clamp(8.125rem, 7.855rem + 1.35vw, 9.375rem);
                    top: 25%;
                    right: 12px;
                    transform: translateY(-50%);
                    rotate: -2deg;
                    z-index: 0;
                }
            }
        }
        .message_cap{
            width: 50%;
            p:not(:last-of-type){
                margin-bottom: 2em;
            }
            @media (max-width:480px){
                width: 100%;
                padding-left: 65px;
                font-size: 13px;
                margin-bottom: 50px;
            }
        }
        .message_img{
            max-width: 380px;
            width: 50%;
            position: absolute;
            left: 0;
            bottom: 0;

            @media (max-width:950px){
                transform: translateX(-10%);
            }
            @media (max-width:480px){
                position: static;
                transform: translateX(-30px);
                width: 100%;
            }
        }
    }
    .message_wave{
        width: 100vw;
        position: absolute;
        left: 0;
        bottom: 50px;
        z-index: 0;
        @media (max-width:480px){
            width: auto;
            height: 200px;
            bottom: 250px;
            img{
                object-fit: cover;
                height: 100%;
            }
        }
    }
}
.message:first-child {
    padding-bottom: 5%;
}
.message:last-child {
    padding-top: 0;
}
.message:last-child .pen-circle {
    left: 0;
}
.message .message_wave {
    bottom: 0;
}
@media (max-width:950px){
    .message:last-child .pen-circle {
        left: 65px;
    }
}

div:has(>.staff){
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 40px 40px 0 0;
    width: 100vw;
    height: 100svh;
    background: var(--bgColor2);
    z-index: 0;
}
.staff{
    padding: 0!important;
    position: relative;
    &::before{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 40px 40px 0 0;
        width: 100vw;
        height: 200svh;
        margin: 0 calc(50% - 50vw);
        background: var(--bgColor2);
        z-index: 0;
    }
    .staff_inner{
        position: relative;
        z-index: 1;
        width: 100%;
        padding-left: var(--asideLeft);
        .staff_inner_contain{
            width: 100%;
            height: 100vh;
            position: relative;
            @media (max-width:768px){
                overflow: hidden;
            }
            .staff_list{
                position: absolute;
                /* top: 60px; */
                top: 50%;
                transform: translateY(-50%);
                left: 0;
                display: grid;
                grid-template-columns: repeat(12, 150px);
                gap: 40px 20px;
                @media (max-width:1280px){
                    /* grid-template-columns: repeat(12, 125px); */
                    grid-template-columns: repeat(12, clamp(6.875rem, 6.563rem + 1.56vw, 7.813rem));
                }
                @media (max-width:480px){
                    /* grid-template-columns: repeat(10, 110px); */
                    padding: 0 40px;
                }
                .staff_title{
                      grid-column: 1 / span 3;
                      grid-row: 1;
                      .staff_title_text{
                          width: clamp(21.25rem, 20.709rem + 2.7vw, 23.75rem);
                          margin-bottom: 45px;
                      }
                  }
                  .staff_item:nth-of-type(2) { grid-column: 4 / span 2; grid-row: 1;}
                  .staff_item:nth-of-type(3) { grid-column: 6 / span 2; grid-row: 1; }
                  .staff_item:nth-of-type(4) { grid-column: 8 / span 2; grid-row: 1; }
                  .staff_item:nth-of-type(5) { grid-column: 3 / span 2; grid-row: 2; }
                  .staff_item:nth-of-type(6) { grid-column: 5 / span 2; grid-row: 2; }
                  .staff_item:nth-of-type(7) { grid-column: 7 / span 2; grid-row: 2; }
/*                  .staff_item:nth-of-type(8) { grid-column: 7 / span 2; grid-row: 2; }*/
                  .staff_btn { grid-column: 9 / span 3; grid-row: 2; align-self: center; text-align: center;}
                  /* @media (max-width:480px){
                    .D { grid-column: 1 / span 2; grid-row: 2; }
                    .H { grid-column: 9 / span 2; grid-row: 2; }
                  } */
/*				もう1人増えたら .staff_item:nth-of-type(5) { grid-column: 10 / span 2; grid-row: 1; }
				 .staff_btn { grid-column: 9 / span 3; grid-row: 2; align-self: center; text-align: center;} に変更
				*/
                .staff_item{
                    .staff_box{
                        position: relative;
                        .staff_tmb{
                            border-radius: 20px;
                            overflow: hidden;
                            margin: 5px;
                        }
                        .staff_cap{
                            width: calc(100% - 50px);
                            background: var(--bgColor2);
                            position: absolute;
                            left: 0;
                            bottom: -5px;
                            border-top: 1px solid;
                            border-right: 1px solid;
                            padding-left: 1em;
                            .staff_cap_info{
                                position: relative;
                                .staff_cap_info_position{
                                    font-weight: 300;
                                    rotate: -5deg;
                                    border-radius: 30px;
                                    background: #fff;
                                    border: 1px solid var(--mainText);
                                    display: inline-block;
                                    font-size: 13px;
                                    padding: 0 1em;
                                    margin-left: 1em;
                                    margin-top: -2em;
                                    translate:0 -50% ;
                                }
                                .staff_cap_info_copy{
                                    margin-bottom: 5px;
                                    span{
                                        background: linear-gradient(transparent 60%, #F2FEBC 0%);
                                    }
                                }
                                .staff_cap_info_tag{
                                    font-weight: 300;
                                    rotate: 15deg;
                                    border-radius: 30px;
                                    background: var(--lightGreen);
                                    border: 1px solid var(--mainText);
                                    display: inline-block;
                                    font-size: 13px;
                                    padding: 0 1em;
                                    position: absolute;
                                    top: 0;
                                    right: 0;
                                    translate: 50% -50%;
                                }
                            }
                        }
                    }
                    .staff_name{
                        padding-left: 1em;
                    }
                }
            }
        }
    }
}
.discover{
    padding: 0 0 5% 0;
    position: relative;
    &::before{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100%;
        margin: 0 calc(50% - 50vw);
        background: var(--bgColor2);
        z-index: 0;
    }
    .discover_inner{
        position: relative;
        z-index: 1;
        .discover_title{
            width: clamp(12.5rem, 11.824rem + 3.38vw, 15.625rem);
            position: sticky;
            top: calc(var(--discoverMgnTop) / 2);
            margin-left: auto;
            margin-right: 140px;
            z-index: 10;
            @media (max-width:480px){
                margin-right: 20px;
                top: calc(var(--discoverMgnTop) * 1);
            }
        }
        .discover_container{
            position: sticky;
            padding-left: var(--asideLeft);
            padding-right: clamp(0rem, -9.779rem + 16.47vw, 8.75rem);
            padding-bottom: 100px;
            /* height: 80vh; */
            width: calc(100% - 50px);
            background: var(--bgColor);
            border: 1px solid;
            border-radius: 0 40px 0 0;
            margin-bottom: var(--discoverMgnTop);
            @media (max-width:480px){
                width: calc(100% - 20px);
            }
            &.is_first{
                top: var(--discoverMgnTop);
                @media (max-width:480px){
                    top: calc(30px + var(--discoverMgnTop));
                }
            }
            &.is_second{
                top: calc(2 * var(--discoverMgnTop));
                @media (max-width:480px){
                    top: calc(30px + (2*var(--discoverMgnTop)));
                }
            }
            &.is_third{
                top: calc(3 * var(--discoverMgnTop));
                @media (max-width:480px){
                    top: calc(30px + (3*var(--discoverMgnTop)));
                }
            }
            .discover_container_head{
                width: 90%;
                margin-left: auto;
                margin-right: auto;
                height: var(--discoverMgnTop);
                line-height: var(--discoverMgnTop);
                font-weight: 300;
                margin-bottom: 55px;
                @media (max-width:480px){
                    font-size: 10px;
                }
            }
            .discover_container_inner{
                width: 90%;
                margin-left: auto;
                margin-right: auto;
                display: flex;
                flex-wrap: wrap;
                align-items: stretch;
                @media (max-width:480px){
                    display: block;
                }
                .discover_container_cap{
                    width: 60%;
                    padding-left: clamp(0rem, -9.779rem + 16.47vw, 8.75rem);
                    display: flex;
                    flex-direction: column;
                    align-items: stretch;
                    @media (max-width:480px){
                        width: 100%;
                        margin-bottom: 40px;
                        font-size: 13px;
                    }
                    .discover_container_title{
                        line-height: 1.1;
                        margin-bottom: 60px;
                        > span{
                            display: inline-block;
                            > p{
                                overflow: hidden;
                                span{
                                    transform: translateY(120%);
                                }
                            }
                            @media (max-width:480px){
                                display: block;
                            }
                        }
                        span{
                            position: relative;
                            display: inline-block;
                            .enFont{
                                font-size: clamp(1.875rem, 1.537rem + 1.69vw, 3.438rem);
                                font-weight: 300;
                            }
                            .jpText{
                                font-size: 13px;
                                border-radius: 30px;
                                background: #EEF4E8;
                                border: 1px solid;
                                padding: 3px 1em;
                                display: inline-block;
                                position: absolute;
                                bottom: 0;
                                right: 0;
                                transform: translate(50% , 100%);
                                rotate: -4deg;
                                @media (max-width:480px){
                                    right: 0;
                                    /* transform: translate(-25%,20px); */
                                    white-space: nowrap;
                                }
                            }
                        }
                    }
                    .btn_more{
                        margin-top: auto;
                    }
                }
                .discover_container_img{
                    width: 40%;
                    display: grid;
                    place-content: center;
                    @media (max-width:480px){
                        width: 50%;
                        margin-left: auto;
                    }
                }
            }
        }
    }
}
.join{
    background: var(--bgColor2);
    border-radius: 0 0 40px 40px;
    padding-bottom: 15%;
    @media (max-width:480px){
        padding-bottom: 140px;
    }
    .join_inner{
        max-width: 1180px;
        margin: auto;
        @media (max-width:768px){
            overflow: hidden;
        }
        .join_head{
            font-size: 24px;
            margin-bottom: 1em;
            font-weight: 300;
            @media (max-width:480px){
                text-align: center;
            }
        }
        .join_text{
            font-size: 110px;
            color: #A0C4C4;
            font-weight: 300;
            width: 100vw;
            margin: 0 calc(50% - 50vw - var(--hamidashi));
            white-space: nowrap;
        }
        .join_cap{
            display: flex;
            justify-content: space-between;
            width: 90%;
            margin: auto;
            @media (max-width:768px){
                display: block;
                text-align: center;
                font-size: 13px;
                .join_cap_text{
                    margin-bottom: 20px;
                }
            }
            .btn_more{
                width: auto;
                background: var(--lightGreen);
                border-radius: 40px;
                border: 1px solid;
                padding: 3px 1em;
                @media (max-width:480px){
                    height: auto;
                    padding: 8px 1em;
                }
            }
        }
    }
}
.flow{
    padding: 5% 0;
    @media (max-width:480px){
        padding: 110px 0;
    }
    .flow_inner{
        width: 90%;
        margin: auto;
        .flow_title{
            display: flex;
            align-items: center;
            margin-bottom: 75px;
            @media (max-width:480px){
                display: block;
            }
            .flow_title_text{
                width: clamp(20rem, 19.662rem + 1.69vw, 21.563rem);
            }
            .flow_title_cap{
                padding-left: 50px;
                @media (max-width:480px){
                    padding-left: 0;
                    margin-top: 50px;
                    font-size: 13px;
                }
            }
        }
        .flow_list{
            counter-reset: number;
            @media (max-width:480px){
                width: 90%;
                margin-left: auto;
            }
            .flow_item{
                display: flex;
                align-items: stretch;
                justify-content: start;
                padding: 40px 0;
                border-top: 1px solid;
                position: relative;
                transform: translateY(50px);
                opacity: 0;
                .flow_fade_item{
                    transform: translateY(50px);
                    opacity: 0;
                }
                > *{
                    width: 75%;
                }
                &:first-of-type{
                    padding-top: 0;
                    border-top: none;
                }
                &::before{
                    counter-increment: number;
                    content: "(" counter(number,decimal-leading-zero) ")";
                    font-size: 24px;
                    font-weight: 300;
                    width: 25%;
                    @media (max-width:480px){
                        font-size: 18px;
                    }
                }
                &::after{
                    content: "";
                    position: absolute;
                    top: 0;
                    left: 25%;
                    width: 1px;
                    height: 100%;
                    border-right: 1px solid;
                }
                .flow_item_flex{
                    display: flex;
                    column-gap: 30px;
                    .flow_item_box:nth-child(2){
                        padding-left: 0;
                        width: 50%;
                        @media (max-width:480px){
                            padding-left: 40px;
                            width: 100%;
                        }
                    }
                    @media (max-width:480px){
                        flex-direction: column;
                        gap: 1em;
                    }
                }
                .flow_item_box{
                    padding-left: 40px;
					width: 50%;
					@media (max-width:480px){
                            width: 100%;
                        }
                    .flow_item_title{
                        font-size: 22px;
                        font-weight: bold;
                        margin-bottom: 15px;
                        @media (max-width:480px){
                            font-size: 18px;
                        }
                    }
                    .flow_item_text{
                        font-size: 13px;
                        .lineicon{
                            width: 18px;
                            display: inline;
                            margin-right: 5px;
                        }
                        p{
                            margin-bottom: 1em;
                        }
                    }
                }
            }
        }
    }
}
.navi{
    .navi_inner{
        width: 80%;
        margin-left: auto;
        margin-right: 5%;
        .navi_list{
            .navi_item{
                border-top: 1px solid;
                /* &:first-of-type{
                    border: none;
                } */
                .navi_item_inner{
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 40px 0;
                    @media (max-width:480px){
                        padding: 20px 0;
                    }
                    .navi_item_title{
                        .navi_item_title_en{
                            font-size: clamp(1.875rem, 1.713rem + 0.81vw, 2.625rem);
                            font-weight: 300;
                            overflow: hidden;
                            span{
                                display: inline-block;
                                transform: translateY(120%);
                            }
                        }
                        .navi_item_title_jp{
                            @media (max-width:480px){
                                font-size: 11px;
                            }
                        }
                    }
                    .btn_more{
                        pointer-events: none;
                        @media (max-width:480px){
                            font-size: 11px;
                        }
                        .arrow{
                            rotate: -45deg;
                        }
                    }
                }
            }
        }
    }
}


.recruit-footer{
    /* height: 100vh; */
    scroll-snap-type: y mandatory;
    /* overflow: clip; */
}
.recruit-footer_inner{
    scroll-snap-align: start;
}
.recruit-footer_inner_contain{
    position: relative;
    padding: 20px 50px;
    height: 100%;
}
.recruit-footer_inner_navi{
    display: flex;
    justify-content: space-between;
}
.recruit-footer_inner_navi_box{
    width: auto;
    white-space: nowrap;
    font-weight: 300;
}
.recruit-footer_inner_navi_box:last-child .recruit-footer_inner_navi_title {
    background-color: #BAEF4B;
}
.recruit-footer_wrap {
    padding-left: var(--asideLeft);
    display: flex;
    gap: 3rem;
}
.recruit-footer_inner_navi_item_link:nth-child(n+2) {
    padding-top: 8px;
}
.recruit-footer_inner_navi_box_container{
    display: inline-block;
}
.recruit-footer_inner_navi_title{
    position: relative;
    font-weight: 300;
    border-radius: 30px;
    background: #fff;
    padding: 0 2.5em;
    border: 1px solid;
    margin-bottom: 1em;
    font-size: 13px;
    display: inline-block;
}
 .recruit-footer_inner_navi_item{
    font-size: 13px;
    margin-bottom: 1em;
}
.recruit-footer_inner_navi_item_link{
    display: block;
    width: 100%;
}
.recruit-footer_inner_navi_title .arrow_link{
    width: 10px;
    right: 8px!important;
        position: absolute;
    top: 50%;
    right: 0px;
    transform: translateY(-50%);
    width: 10px;
}
.recruit-footer_inner_img{
    height: 100%;
    overflow: hidden;
    border-radius: 20px;
}
.recruit-footer_inner_img img{
    object-fit: cover;
    object-position: center;
    height: 100%;
    width: 100%;
    max-height: 350px;
}
.recruit-footer_inner_text{
    padding-top: 10px;
    color: var(--lightGreen);
    font-weight: 300;
    text-align: center;
    line-height: 1.0;
    white-space: nowrap;
}
.recruit-footer_inner_navi_box:nth-of-type(3) .recruit-footer_inner_navi_title {
    background-color: var(--lightGreen);
}
@media (max-width: 599px) {
    .recruit-footer_wrap {
        flex-direction: column;
    }
    .recruit-footer_inner_contain {
        padding: 20px;
    }
}