@charset "utf-8";

/*=================================
common
=================================*/
:root{
    --primary-white: #FEFFFA;
    --primary-black: #222222;
    --primary-greyblue: #BBDBDA;
    --primary-skyblue: #F5F5F5;
}

html{
    font-size: 62.5%;
    scroll-behavior: smooth;
}

body{
    font-family: "Ubuntu","Noto Sans JP";
    color: var(--primary-black);
    font-optical-sizing: auto;
    font-weight: 500;
    letter-spacing: 0.06em;
    background-color: var(--primary-white);
    line-height: 1.5;
  }

img{
    width: 100%;
    height: auto;
  }

.btn1{
    text-align: center;
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.011em;
    padding: 22px 0 21px 0;
    position: relative;
    width: 24.3vw;
    height: 85px;
    background: var(--primary-black);   
    min-width: 261px; 
    display: block;
    margin: 0 auto;
}

.main_topic{
    color: var(--primary-black);
    font-family: Ubuntu;
    font-size: 13rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center;
}

.main_text{
    color: var(--primary-black);
    font-family: "Noto Sans JP";
    font-size: 2.2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
 

 /* common sp */
@media screen and (max-width: 769px){
body{
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.05em;
    line-height: 1.3;
    }
}

/* show white */
.show .show .main_title::after{
  background-image: linear-gradient(
    90deg,
    #222,
    #222 50%,
    #fff 50%,
    #fff
  );
  background-size: 200%, 100%;
  animation-name: bar-anime;
  animation-duration: 1.4s;
  animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1); /* easeInOutQuintのイージング */
}

@keyframes bar-anime {
0% {
    background-position: 100% 0;
}

100% {
    background-position: 0% 0;
}
}

.main_title::after{
background-image: linear-gradient(
    90deg,
    #222,
    #222 50%,
    #fff 50%,
    #fff
);
background-size: 200%, 100%;
animation-name: bar-anime;
animation-duration: 1.4s;
animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1); /* easeInOutQuintのイージング */
}

@keyframes bar-anime {
0% {
    background-position: 100% 0;
}

100% {
    background-position: 0% 0;
}
}

/* show blk */
.show .main_title--blk::after{
background-image: linear-gradient(
    90deg,
    #fff,
    #fff 50%,
    #222 50%,
    #222
);
background-size: 200%, 100%;
animation-name: bar-anime;
animation-duration: 1.4s;
animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1); /* easeInOutQuintのイージング */
}

@keyframes bar-anime {
0% {
    background-position: 100% 0;
}

100% {
    background-position: 0% 0;
}
}

.main_title{
    font-family: Ubuntu;
    font-size: 6.944vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    position: relative;
    margin-top: 100px;
    margin-left: 68px;
    display: flex;
    gap: 20px;
    align-items: baseline;
    margin: 0 auto;
}

.main_title::after{
    content: "";
    display: block;
    width: 64.37vw;
    height: 3.125vw;
    flex-grow: 1;
}


.main_subtitle{
    font-family: "Noto Sans JP";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    max-width: 1380px;
    margin: 0 auto;
}



/* SP header　*/
@media screen and (max-width: 769px){
.header__topic{
    background-color: var(--primary-white);
}

.main_title{
    font-family: Ubuntu;
    font-size: 9.333vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 0;
    gap: 8px;
}    

.main_title::after{
    content: "";
    display: block;
    width: 64.37vw;
    height: 4.8vw;
    flex-grow: 1;
}

.main_subtitle{
    font-family: "Noto Sans JP";
    font-size: 3.733vw;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding: 0;
}
}


/*=================================
main
=================================*/
/* main visual */

.main_top{
    background-image: url(../img/recruit_top.png);
    background-size: cover;
    background-position: center bottom;
    padding: 16.416vw 11.875vw 15.486vw 57.708vw;   
}

.interview_top{
    background-color: var(--primary-greyblue);
    width: 76.388vw;
    height: 107.94vw;
    border-radius: 0px 80px 0px 0px;
    position: relative;
    margin: 0 auto;
    margin-top: 50px;
    max-width: 1700px;
}

.interview_back{
    position: relative;
}

.interview_back::after{
    content: '';
    display: block;
    width: 100%;
    top: 13.888vw;
    bottom: 0;
    background-color: var(--primary-black);
    position: absolute;
    z-index: -1;
    border-top-right-radius: 80px;
}

.top_topic{
    font-family: Ubuntu;
    font-size: 2.361vw;
    color: var(--primary-white);
    font-weight: 700;
    line-height: normal;
    display: inline-block;
    border-bottom: 12px solid #fefffe;
    margin-bottom: 4.166vw;
    padding-bottom: 0.208vw;
}

.top_title{
    color: var(--primary-white);
    /* text-align: center; */
    font-family: "Noto Sans JP";
    font-size: 5.2083vw;
    font-style: normal;
    font-weight: 700;
    line-height:  140%;
    margin-bottom: 4.25vw;
    white-space: nowrap;
    padding-left: 0.2em;
    /* position: absolute;
    top: 274px;
    left: 820px; */
}

.top_text{
    color: var(--primary-white);
    /* text-align: center; */
    font-family: "Noto Sans JP";
    font-size: 1.388vw;
    font-style: normal;
    font-weight: 500;
    line-height: 195%; 
    white-space: nowrap;
    text-align: center;
}

/* SP main　*/
@media screen and (max-width: 769px){
.top_topic{
    font-size: 4.8vw;
    margin-bottom: 8vw;
    border-bottom: 2.133vw solid #fefffe;
}

.main_topic{
    font-size: initial;
}


.top_title{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 8vw;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    margin-bottom: 5.333vw;
    padding-left: 0.8em;
} 

.top_text{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 3.2vw;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
}


.main_top{
    background-image: url(../img/recruit_top_sp.png);
    padding: 17vw 0 17.6vw 35.2vw;;
    background-size: left;
}
}


/* features */
.features{
    padding: 11vw 4.722vw;
}

.features_set{
    text-align: left;
}

.features_title{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 4.861vw;
    font-style: normal;
    font-weight: 700;
    line-height: 137.143%;
}

.features_text{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 1.388vw;
    font-style: normal;
    font-weight: 500;
    line-height: 166.667%;
    margin-top: 2.083vw;
    margin-bottom: 5vw;
}

.features_list{
    font-family: "Noto Sans JP";
    font-size: 2.43vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-bottom: 2.777vw;
    white-space: nowrap;
}

.features_icon{
    width: 8.333vw;
    height: 8.333vw;
    margin: 0 auto;
    margin-bottom: 1.388vw;
}

.features_item{
    font-family: "Noto Sans JP";
    font-size: 1.111vw;
    font-style: normal;
    font-weight: 400;
    line-height: 182.2%;
    white-space: nowrap;
}

.features_group{
    display: flex;
    gap: 2.5vw;
    justify-content: center;
}

.features_topic{
    border-radius: 3.472vw;
    padding: 5.55vw 3.19vw 3.541vw 3.19vw;
    border: 0.138vw solid var(--primary-black);
    width: 23.75vw;
    text-align: center;
}

@media screen and (max-width: 769px){
.features_title{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 6.933vw;
    font-style: normal;
    font-weight: 700;
    line-height: 203.846%;
    white-space: nowrap;
}

.features_text{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 3.2vw;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    margin-bottom: 10.666vw;
}

.features_group{
    flex-direction: column;
    align-items: center;
    gap: 5vw;
}

.features_list{
    text-align: center;
    font-size: 5.333vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.features_icon{
    width: 17.066vw;
    height: 14.933vw;
    margin: 0;
    margin-right: 8vw;
    margin-bottom: 1.388vw;
}

.features_item{
    font-family: "Noto Sans JP";
    font-size: 2.666vw;
    font-style: normal;
    font-weight: 400;
    line-height: 126.988%;
    margin-top: 20px;
    
}

.features_topic{
    border-radius: 6.933vw;
    padding: 4.466vw 11.666vw;
    border: 0.533vw solid var(--primary-black);
    width: 91.466vw;
    height: 57.066;
    text-align: center;
}

.features_sp{
    display: flex;
}

}

/* interview */
.interview_line{
    padding: 0 4.722vw 0;    
}


.interview-top{
    position: relative;
}

.interview_title{
    font-family: "Noto Sans JP";
    font-size: 4.816vw;
    font-style: normal;
    font-weight: 700;
    line-height: 135.714%;
    margin-top: 7.638vw;
    margin-left: 6.597vw;
    margin-bottom: 5.902vw;;
}

.interview_img--top{
    width: 30.694vw;
    height: 32.777vw;
    position: absolute;
    right: 10px;
    top: 16px;
}

.interview_topic{
    display: flex;

}

.interview-block{
    display: flex;
}

.interview_subname{
    color: var(--primary-skyblue);
    font-family: Ubuntu;
    font-size: 5.902vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1.7px;
    margin-left: 15px;
}

/* 上 */
.interview-text--up{
    width: 59.644w;
    position: absolute;
    right: 0px;
    padding: 3.861vw 2.777vw 0 11.111vw;
    height: auto;
}

.interview_img{
    width: 24.30vw;
    height: auto;
    display: block;
    position: absolute;
    top: 35.8vw;
    left: 2.777vw;
    z-index: 1000;
}

.interview-text--up h3{
    font-family: "Noto Sans JP";
    font-size: 1.666vw;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 15px;
} 

.interview-text--up p{
    font-family: "Noto Sans JP";
    font-size: 1.111vw;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin-bottom: 2.777vw;
}

.interview-text--up{
    gap: 52px;
    background-color: var(--primary-white);
    width: 56.944vw;
    position: absolute;
    right: 0;
    /* padding: 4.513vw 4.305vw 4.513vw 12.361vw; */
}

.interview-block--under{
    display: flex;
    gap: 52px;
}

.interview-text--under{
    gap: 52px;
    background-color: var(--primary-white);
    width: 56.944vw;
    height: 480px;
    position: relative;
}


/* 下 */
.interview-text--under{
    width: 59.644w;
    position: absolute;
    right: 0px;
    padding-left: 11.111vw;
    padding-top: 4.861vw;
    padding-right: 2.777vw;
    height: 33.333vw;
}

.interview-text--under h3{
    font-family: "Noto Sans JP";
    font-size: 1.666vw;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 15px;
} 

.interview-text--under p{
    font-family: "Noto Sans JP";
    font-size: 1.111vw;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin-bottom: 2.777vw;
}

.interview-text--under{
    gap: 52px;
    background-color: var(--primary-white);
    width: 56.944vw;
    position: absolute;
    bottom: 3.819vw;
    left: 0;
    padding-right: 11.111vw;
    padding-top: 5vw;
    padding-left: 2.777vw;
    height: 33.333vw;
}

.interview-block--under{
    display: flex;
    gap: 52px;
}

.interview-img--under{
    width: 24.30vw;
    height: auto;
    display: block;
    position: absolute;
    z-index: 1000;
    bottom: 3vw;
    right: 2.083vw;
}

.interview_br--sp{
    display: none;
}

.interview-img--under_sp{
    display: none;
}

.interview-img--up--sp{
    display: none;
}

@media screen and (max-width: 769px){
.interview{
    padding: 0;
    background-color: var(--primary-white);
}

.interview_back{
    background-color: var(--primary-white);
    padding-bottom: 0;
}

.interview_line{
    padding: 6.94vw 4.72vw 5.333vw 4.72vw;
}

.interview_top{
    border-radius: 0px 50px 0px 0px;
    margin: 0;
    width: 100%;
    height: auto;
    padding: 10px 4.722vw 20px;
}

.interview_title{
    font-size: 7.2vw;
    font-style: normal;
    font-weight: 700;
    line-height: 140.741%;
    margin-left: 0.333vw;
    margin-bottom: 6.666vw;
    text-align: center;
}

.interview_topic{
    display: flex;
    align-items: flex-end;
}

.interview-block{
    display: flex;
    flex-direction: column-reverse;
}

.interview_img--top{
    width: 46.666vw;
    position: absolute;
    right: 0.8vw;
    top: auto;
    height: auto;
}

.interview_img--top img{
    width: 90%;
}

.interview_img{
    width: 80vw;
    height: 53.333vw;
    margin: 20px auto;
    top: 151.333vw;
    left: 10.133vw;
}

.interview_subname{
    font-family: Ubuntu;
    font-size: 9.333vw;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0.7px;
}

.interview_br--sp{
    display: block;
}

.interview-text {
    padding: 7.2vw 5.6vw 0;
    position: static;
    width: 100%;
}

.interview-text--up{
    height: 96vw;
}

.interview-text--under{
    height: 91vw;
}


.interview-text h3{
    font-size: 4.266vw;
    font-style: normal;
    font-weight: 700;
    line-height: 82.277%;
    margin-bottom: 2.666vw;
    white-space: nowrap;
}

.interview-text p{
    font-size: 3.733vw;
    font-style: normal;
    font-weight: 400;
    line-height: 128.571%;
    margin-bottom: 5.866vw;
}

.br_pc--text{
    display: none;
}

.interview-img--up--sp{
    display: block;
    position: static;
}

.interview-img--under{
    display: none;
}

.interview-img--under_sp{
    display: block;
    width: 80vw;
    height: 53.333vw;
    position: static;
    bottom: 9.933vw;
    left: 5vw;
    margin: 20px auto;
}

.interview-block--under{
    display: flex;
    flex-direction: column;
}

.interview-block--under {
    gap: 0;
}

.interview-img--up--pc{
    display: none;
}

}


/* recruit */
.recruit{
    background-color: var(--primary-black);
    padding: 6.944vw 4.722vw;
}

.recruit_inner{
    background-color: var(--primary-white);
}

.main_title--recruit{
    color: var(--primary-white);
}

.main_subtitle--recruit{
    color: var(--primary-white);
}

.main_title--recruit::after{
    content: "";
    display: block;
    width: 64.37vw;
    height: 3.125vw;
    background-color: var(--primary-white);
    flex-grow: 1;
}

.section--corporate{
    background-color: var(--primary-skyblue);
    padding: 100px;
}

.recruit_list{
    background-color: var(--primary-white);
    max-width: 1380px;
    width: 76.38vw;
    margin: 0 auto;
    padding: 0 40px 90px;
    margin-top: 60px;
    margin-bottom: 50px;
}

.recruit_list table{
    width: 100%;
}

.recruit_list th{
    font-family: "Noto Sans JP";
    font-size: 1.25vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    width: 14.93vw;
    padding: 50px 2.1% 50px 0;
    position: relative;
    text-align: center;
}

.recruit_list tr:not(:last-child) th::after{
    content: "";
    display: block;
    height: 0.208vw;
    background-color: var(--primary-black);
    width: 84.418%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.recruit_list td{
    font-family: "Noto Sans JP";
    font-size: 1.25vw;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border-bottom: 0.208vw solid var(--primary-black);
    padding: 50px;
}

.recruit_list tr:last-child td {
  border-bottom: none;
}


.recruit_btn--cvtsp{
    display: none;
}

.recruit_btn--cvt{
    color: var(--primary-black);
    font-size: 1.736vw;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.011em;
    padding: 1.944vw;
    position: relative;
    width: 24.3055555556vw;
    background: var(--primary-white);
    border: 3px solid #fff;
    margin-top: 58px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 3px solid var(--primary-black);
    margin: 0 auto;
    margin-top: 70px;
}

.recruit_btn--cvt::before{
    content: "";
    background-image: url(../img/arrow_blk.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.041vw;
    height: 1.666vw;
    position: absolute;
    right: 22px;
}

.recruit_btn--cvt:hover:before{
    background-image: url(../img/arrow.svg);
}

@media screen and (max-width: 769px){
.section--corporate{
    padding: 35px 18px 15px 18px;
}

.recruit{
    padding: 50px 4.722vw 30px;
}



.recruit_inner{
    padding: 15px 30px 30px;
}

.recruit_list{
    margin: 30px auto;
    width: 100%;
    padding: 0;
    background-color: var(--primary-w);
}

.recruit_list tr{
    display: flex;
    flex-direction: column; 
    padding-top: 15px;
    color: var(--primary-black);
}

.recruit_list th{
    font-family: "Noto Sans JP";
    font-size: 1.6rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 0;
    white-space: nowrap;
    text-align: left;
    color: var(--primary-black);
}

.recruit_list td{
    font-family: "Noto Sans JP";
    font-size: 1.4rem;
    font-style: normal;
    font-weight: 400;
    line-height: 106.25%;
    padding: 10px 0 15px;
    border-bottom: 2px solid var(--primary-black);
    line-height: 150%;
    color: var(--primary-black);
    }

.recruit_list th::after{
    display: none;
}

.recruit_list tr:not(:last-child) th::after{
    display: none;
}

.recruit_btn--cvt{
    display: none;
}

.recruit_btn--cvtsp{
    display: block;
        color: var(--primary-black);
        font-size: 1.6rem;
        font-weight: 600;
        line-height: 1;
        letter-spacing: 0.011em;
        padding: 19px 17px;
        position: relative;
        width: 62.1333333333vw;
        background: var(--primary-white);
        border: 2px solid var(--primary-black);
        margin-top: 58px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 35px auto 35px;
        min-height: 55px;
        height: auto;
}

.recruit_btn--cvtsp::before{
    content: "";
    background-image: url(../img/arrow_blk.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.041vw;
    height: 1.666vw;
    position: absolute;
    right: 22px;
}

.recruit_btn--cvtsp:hover:before{
    background-image: url(../img/arrow.svg);
}

.main_title--recruit::after{
    content: "";
    display: block;
    width: 64.37vw;
    height: 4.8vw;
    flex-grow: 1;
}

}

/* cvt */
.recruit_cvt{
    background-color: var(--primary-black);
}

.recruit_top{
   background-color: var(--primary-greyblue);
   width: 100%;
   height: 42.194vw;
   border-radius: 50px 50px 0px 0px;
   position: relative;
}

.recruit_group img{
    position: absolute;
    width: 53.152vw;
    bottom: 0;
}

.recruit_topic{
   padding:  8.816vw 4.816vw 0 54.375vw;
}

.recruit_topic h2{
    font-family: "Noto Sans JP";
    font-size: 4.513vw;
    font-style: normal;
    font-weight: 700;
    line-height: 150.769%;
    margin-bottom: 2.083vw;
    white-space: nowrap;
    text-align: center;
    
}

.recruit_topic p{
    font-family: "Noto Sans JP";
    font-size: 1.25vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-bottom: 3.472vw;
    white-space: nowrap;
    text-align: center;
}

.recruit_btn--cvt2{
    margin-top: 0;
}

@media screen and (max-width: 769px){
.recruit_top {
    height: auto;
    padding: 40px 4.722vw 0;
}

.recruit_group img{
    position: static;
    width: 89.866vw;
}

.recruit_topic {
    padding: 0;
}

.recruit_group{    
    display: flex;
    flex-direction: column-reverse;
}

.recruit_img{
    text-align: center;
}

.recruit_btnContact_sp{
    display: block;
    color: var(--primary-black);
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.011em;
    padding: 19px 17px;
    position: relative;
    width: 62.1333333333vw;
    background: var(--primary-white);
    border: 2px solid var(--primary-black);
    margin-top: 58px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 40px auto 40px;
    min-height: 55px;
    height: auto;
    margin: 40px auto 40px;
}

.recruit_btnContact{
    display: none;
}

.recruit_btnContact_sp::before{
    content: "";
    background-image: url(../img/arrow_blk.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.041vw;
    height: 1.666vw;
    position: absolute;
    right: 22px;
}

.recruit_btnContact_sp:hover:before{
    background-image: url(../img/arrow.svg);
}

.recruit_topic h2{
    text-align: center;
    font-size: 9.333vw;
    font-style: normal;
    font-weight: 700;
    line-height: 137.143%;
    margin-bottom: 4vw;
}

.recruit_topic p{
    text-align: center;
    font-family: "Noto Sans JP";
    font-size: 3.466vw;
    font-style: normal;
    font-weight: 500;
    line-height: 138.462%;
    margin-bottom: 0;
}

.recruit_br--sp{
    display: block;
}
}