@charset "UTF-8";
.recruit{
    max-width: 1440px;
    margin: 0 auto;
}
.footer_r{
    background-color: var(--primary-red);
    display: flex;
    width: 100%;
    align-items: center;
    margin-top: 20px;
}
.recruit_pc{
    display: none;
}
.recruit_sp{
    max-width: 575px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    background-image: url(../images/c_tent.png);
    background-size: 130%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: top;
    padding-bottom: 80px;
    margin-top: -50px;
}
.recruit_title{
    text-align: center;
    font-family: "Kaisei Opti";
    font-size: 2.8rem;
    font-weight: 700;
    margin-top: 62%;

}
.border_sp{
    border-bottom: 3px solid var(--primary-red);
    padding-bottom: 10px;
    display: inline-block;
}
.txt_r{
    text-align: center;
}
.recruit_txt{
    font-family: "Kaisei Opti";
    font-size: 1.6rem ;
    font-weight: 700;
    padding-top: 6%;
}
.stuff{
    width: 28%;
    margin: 2% 0;
}
.sp_hid{
    display: none;
}
.recruit_txt2{
    font-size: 1.6rem;
    font-weight: 500;
}
.recruit_txt3{
    font-size: 1.4rem;
}
.btn_red_recruit{
        width: 220px;
        height: 50px;
        position: relative;
        background-color:var(--primary-red);
        color: var(--primary-white);
        text-align: center; 
        display: inline-block;
        font-size: 2rem; 
        margin: 2% 0;
        cursor: pointer;
        border-radius: 5px; 
        padding-top: 11px;
        padding-right: 10px;
    } 
.btn_red_recruit::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 4%;
        margin-top: -8px;
        margin-left: -5px;
        border-width: 8px;
        border-style: solid;
        border-color:var(--primary-white) transparent transparent transparent;
        transform: rotate(-90deg);
}
.btn_red_recruit:hover {
        opacity: 0.5;
        background-color:red;
    }
/* recruit 427 */
@media screen and (min-width : 427px) {
    .recruit_title{
        font-size: 3rem;
        margin-top: 48%;
    }
    .recruit_txt{
        padding-top: 12%;
    }
    .recruit_sp{
        padding-top: 80px;
    }
}
/* recruit 553 */
@media screen and (min-width : 553px) {
    .recruit_title{
        margin-top: 52%;
        font-size: 3.6rem;
    }
    .recruit_txt{
        font-size: 2rem;
        padding-top: 6%;
   }
   .recruit_txt2{
        font-size: 2rem;
   }
   .recruit_txt3{
    font-size: 1.6rem;
   }
   .btn_red_recruit{
    margin: 10% 0;
   }
}
/* recruit 769pc */
@media screen and (min-width : 769px) {
    .recruit_sp{
        display: none;
    }
    .recruit_pc{
        display: flex;
        flex-direction: column;
        background-image: url(../images/r_tent.png);
        background-size: contain;
        background-repeat: no-repeat;
        padding: 100px 0;
        margin-top: 80px;
    }
    .recruit_title{
        font-family: "Kaisei Opti";
        font-size: 4rem;
        font-weight: 700;
        margin: 0 auto;
        padding-top: 3%;
        border-bottom: 3px solid var(--primary-red);
        padding-bottom: 10px;
        display: inline-block;
    }
    .stuff{
        width: 16%;
        height: 20%;
        padding-top: 40px;
        margin-right: 20px;
    }
    .recruit_txt{
        font-family: "Kaisei Opti";
        font-size: 2rem;
        font-weight: 700;
        padding: 0;
        margin-top: -5%;
    }
    .recruit_txt2{
        font-family: "IBM Plex Sans JP";
        font-size:  1.8rem;
        font-weight: 500;
        padding-top: 20px;
    }
    .recruit_txt3{
        font-family: "IBM Plex Sans JP";
        font-size: 1.6rem;
    }
    .btn_red_recruit{
        width: 220px;
        height: 60px;
        position: relative;
        background-color:var(--primary-red);
        color: var(--primary-white);
        text-align: center; 
        display: inline-block;
        font-size: 2rem; 
        cursor: pointer;
        border-radius: 5px; 
        padding-top: 18px;
        margin-top: 6%;
    }
    .btn_red_recruit::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 4%;
        margin-top: -8px;
        margin-left: -5px;
        border-width: 8px;
        border-style: solid;
        border-color:var(--primary-white) transparent transparent transparent;
        transform: rotate(-90deg);
}
    .btn_red_recruit:hover {
        opacity: 0.5;
        background-color:red;
    }
    .chara_r{
        width: 12%;
        height: 12%;
        padding-top: 6%;
    }
    .recruit_box{
        display: flex;
        justify-content: center;
        padding-top: 2%;
    }
}
/* recruit pc 897*/
@media screen and (min-width : 897px) {
    .recruit_txt{
        margin-top: 2%;
    }
    .recruit_title{
        padding-top: 6%;
    }
}
/* recruit pc 1025*/
@media screen and (min-width : 1025px) {
    .recruit_title{
        font-size: 5rem;
        padding-top: 7%;
        border-bottom: 3px solid var(--primary-red);
        padding-bottom: 10px;
    }
      .stuff{
        width: 20%;
    }
     .recruit_txt{
        font-size: 2.6rem;
    }
    .recruit_txt2{
        font-size: 2.4rem;
        padding-top: 4%;
    }
    .recruit_txt3{
        font-size: 2.2rem;
    }
    .btn_red_recruit{
        width: 360px;
        margin: 40px 12%;
        padding-top: 18px;
    }
     .chara_r{
        padding-top: 8%;
    }
    .recruit_box{
        padding: 0;
    }
}
    /* recruit pc 1217*/
@media screen and (min-width : 1217px) {
    .recruit_pc{
        background-size: cover;
    }
    .recruit_title{
        font-size: 5.6rem;  
        padding-top: 10%;
    }
    .recruit_txt{
        margin-top: 5%;
    }

}