@charset "UTF-8";

/* ======================
もっと詳しく！制度について
====================== */

.about-header {
    margin-top: 70px;
    padding: 30px 4.2%;
    background: #FFB049;
}
.about-header__subTitle {
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    margin-top: 13px;
}
.about-header__title {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 3px auto 8px;
}
.about-header__item img {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 6px;
}
.about-header__item {
    font-size: 1.4rem;
    margin-top: 5px;
    margin-left: 12%;
}
.about-header__list {
    margin-bottom: 28px;
}
.about-header__content {
    margin: 0 auto;
    max-width: 400px;
    border-radius: 5px;
    border: 1px solid #251A0C;
    background: #FFF;
    box-shadow: 4px 5px 1px 0px #FFE93F;
    position: relative;
}
.about-header__img {
    display: block;
    width: 79px;
    height: auto;
    position: absolute;
    bottom: -31px;
    left: -4%;
}
.About {
    margin: 30px 4.2%;
    text-align: center;
}
.About__txt {
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 1.6;
    margin: 20px auto 0;
    text-align: start;
    max-width: 700px;
}
/* ホバー設定 */
.about-header__item:hover {
    color: var(--primary-orange);
}
@media screen and (min-width: 999px) {
    .about-header {
        margin-top: 130px;
        padding: 40px 4.2%;
    }
    .about-header__subTitle {
        font-size: 1.4rem;
        margin-top: 19px;
    }
    .about-header__title {
        font-size: 3.6rem;
        margin: 0px auto 15px;
    }
    .about-header__item img {
        width: 28px;
        height: 28px;
    }
    .about-header__item {
        font-size: 2.1rem;
        margin-top: 9px;
        margin-left: 30%;
    }
    .about-header__list {
        margin-bottom: 20px;
    }
    .about-header__content {
        max-width: 1000px;
        
    }
    .about-header__img {
        width: 248px;
        bottom: -41px;
        left: 5%;
    }
    .About {
        margin: 70px 12%;
    }
    .About__txt {
        font-size: 1.8rem;
        line-height: 2;
        margin: 30px auto 50px;
        max-width: 1080px;
    }

}
/* ======================
技能実習受入れ人数
====================== */
.howmany {
    background: #FFF9E5;
}

.howmany__title {
    text-align: center;
    font-size: 2.1rem;
    margin: 69px auto 37px;
    position: relative;
}
.howmany__title::after {
    content: '';
    background-image: url(../../images/wavy_sp.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 350px;
    height: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-48%);
    bottom: -12px;
}
.howmany__subtitle {
    position: relative;
}
.howmany__img {
    display: block;
    width: 57px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -32px;
} 
.howmany__txt {
    display: block;
    font-size: 1.2rem;
    letter-spacing: 1.08px;
    max-width: 424px;
    margin: 25px auto 0;
}
.howmany__contener--title {
    color: #FFF;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    border-radius: 50px;
    background: var(--primary-orange);
    width: 150px;
    height: 25px;
    position: relative;
    top: -7px;
    margin: 0 auto;
}
.howmany__contener {
    width: 161px;
    height: 103px;
    background: #FFEAD6;
    text-align: center;
}
.howImg-1,
.howImg-2,
.howImg-3,
.howImg-4 {
    height: 37px;
    margin-top: 13px;
}
.howImg-5,
.howImg-6{
    width: 50px;
    height: 48px;
    margin-top: 6px;
}
.howImg-10 {
    width: 85px;
    height: 48px;
    height: auto;
}
.howImg-15__pc,
.howImg-20__pc {
    display: none;
}
.howImg-15__sp {
    width: 139px;
    height: 48px;
}
.howImg-20__sp {
    width: 147px;
    height: 48px;
}
.howmany__contener-box {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 21px;
    justify-content: center;
    margin-top: 25px;
}
.howmany__contener--number {
    color: #E60012;
    text-align: center;
    font-size: 1.4rem;
    font-weight: 700;
    margin-top: 3px;
}
.howmany__contener--number span {
    color: #251A0C;
}
.howmany__contener--title2 {
    background: #876046;
}
@media screen and (min-width: 999px) {
    .howmany__title {
        font-size: 3.6rem;
        margin: 105px auto 49px;
    }
    .howmany__title::after {
        background-image: url(../../images/wavy_pc.png);
        width: 460px;
        height: 11px;
    }
    .howmany__subtitle {
        position: relative;
        max-width: 400px;
        margin: 0 auto;
    }
    .howmany__img {
        width: 205px;
        position: static;
        position: absolute;
        transform: none;
        top: -42px;
        left: inherit;
        right: -183px;
    } 
    .howmany__txt {
        font-size: 1.8rem;
        letter-spacing: 1.62px;
        margin-top: 60px;
        max-width: 1080px;
        text-align: center;
    }
    .howmany__contener--title {
        font-size: 2.4rem;
        letter-spacing: 1.2px;
        width: 263px;
        height: 55px;
        top: -28px;
        padding-top: 8px;
    }
    .howmany__contener {
        width: 305px;
        height: 266px;
    }
    .howImg-1,
    .howImg-2,
    .howImg-3,
    .howImg-4 {
        height: 65px;
        margin-top: 44px;
    }
    .howImg-5,
    .howImg-6{
        width: 133px;
        height: 136px;
        margin-top: 6px;
    }
    .howImg-10 {
        width: 183px;
        height: 116px;
        margin-top: 23px;
    }
    .howImg-15__pc,
    .howImg-20__pc {
        display: block;
    }
    .howImg-15__sp,
    .howImg-20__sp {
        display: none;
    }
    .howImg-15__pc {
        width: 174px;
        height: 163px;
        margin: 0 auto;
    }
    .howImg-20__pc {
        width: 242px;
        height: 163px;
        margin: 0 auto;
    }
    .howmany__contener {
        position: relative;
    }
    .howmany__contener--number {
        width: 305px;
        margin: 0 auto;
        font-size: 2.4rem;
        position: absolute;
        bottom: 10px;
    }
    .howmany__contener-box {
        gap: 65px 38px;
        margin-top: 90px;
    }
    .hoemany__txt {
        font-size: 1.8rem;
        letter-spacing: 1.62px;
        width: 700px;
        margin: 40px auto 0;
    }
}
/* ======================
受入れ可能職種
====================== */
.jobtype {
    background: #FFEBB0;
}
.jobtype__title--contener {
    margin: 0 auto;
    text-align: center;
}
.jobtype__img {
    width: 95px;
    height: 95px;
    border-radius: 50%;
}
.jobtype__txt {
    color: var(--primary-orange);
    font-size: 1.4rem;
    margin-top: 9px;
}
.jobtype__txt2 {
    color: var(--primary-blue);
}
.jobtype__txt3 {
    font-size: 1rem;
}
.jobtype__content {
    text-align: center;
    width: 97px;
    width: 113px;
}
.jobtype__contener {
    display: flex;
    flex-wrap: wrap;
    gap: 21px 23px;
    width: 91vw;
    margin: 0 auto;
    justify-content: center;
    margin-top: 20px;
}
.btn__pdf {
    margin-top: 10px;
    margin-bottom: 30px;
    font-size: 1.4rem;
    display: inline-block;
    border-radius: 50px;
    border: 1px solid var(--primary-brown);
    padding: 4px 37px 6px 13px;
    position: relative;
}
.btn__pdf::after {
    content: '';
    background-image: url(../../images/icon_right.svg);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    top: 10px;
    right: 15px;
}
.pdf__contener {
    text-align: center;
}
/* ホバー設定 */
.btn__pdf:hover {
    background: var(--primary-white);
}
@media screen and (min-width: 999px) {
    .ginouTitle,
    .tokuteiTitle {
        width: 421px;
    }
    .jobtype__img {
        width: 130px;
        height: 130px;
    }
    .jobtype__txt {
        font-size: 2.1rem;
        margin-top: 10px;
    }
    .jobtype__content {
        width: 160px;
    }
    .jobtype__contener {
        gap: 23px 100px;
        width: 80vw;
        margin-top: 70px;
    }
    .jobtype__txt4 {
        font-size: 2rem;
    }
    .jobtype__txt3 {
        font-size: 1.5rem;
    }
    .jobtype__title--contener {
        margin-top: 70px;
    }
    .btn__pdf {
        font-size: 2.1rem;
        margin-top: 25px;
        margin-bottom: 30px;
        padding: 11px 60px 10px 29px;
        position: relative;
    }
    .btn__pdf::after {
        width: 20px;
        height: 20px;
        position: absolute;
        top: 16px;
        right: 23px;
    }
}



/* ======================
受入れの流れ
====================== */
.frow {
    background: #FFEBD0;
}
.frow__title-contener {
    text-align: center;
}
.frow__contener {
    margin-top: 40px;
}
.frow_number {
    color: #FFF;
    text-align: center;
    font-size: 2.1rem;
    font-weight: 700;
    margin-top: -9px;
}
.step {
    color: #FFF;
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
}
.frow__content {
    position: relative;
}
.frow__decoration {
    background: #EB8317;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 3px solid #F1A550;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -23px;
    z-index: 50;
}
.frow__item--title {
    color: #EB8317;
    font-size: 1.8rem;
    font-weight: 700;
}
.frow__item--txt {
    font-size: 1.4rem;
    font-weight: 300;
    margin-top: 10px;
}
.frow__list {
    border-radius: 20px;
    border: 2px solid #EB8317;
    background: #FFF;
    position: relative;
    padding: 23px 19px;
    max-width: 500px;
    margin: 0 auto;
    margin-top: 26px;
}
.frow__img {
    width: 71px;
    height: auto;
    position: absolute;
    top: 3px;
    right: 10px;
}
.frow__title--content {
    max-width: 650px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 1.26px;
}
.frow__title-1__sp,
.frow__title-2__sp {
    display: block;
    width: 40vw;
    max-width: 166px;
}
.frow__title-1__pc,
.frow__title-2__pc {
    display: none;
}
.tokutei-container {
    max-width: 650px;
    margin: 0 auto;
}
.frow__decoration-1 {
    background: #357BBE;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 3px solid #86B6E3;
    position: relative;
}
.frow__decoration-1::after {
    content: '';
    background-image: url(../../images/triangle_blue_pc.svg);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    right: -16px;
    top: 13px;
}

.frow__decoration-2 {
    background: #BE3535;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 3px solid #E38686;
    position: relative;
}
.frow__decoration-2::before {
    content: '';
    background-image: url(../../images/triangle_red_pc.svg);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    left: -16px;
    top: 13px;
}
.frow__tokutei-txt {
    text-align: center;
    font-size: 1.4rem;
    border-radius: 50px;
    border: 2px solid #251A0C;
    background: #FFF;
    width: 60vw;
    max-width: 430px;
    min-height: 60px;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 12px;
}
.dceo {
    display: block;
    width: 42px;
}
.frow__tokutei-txt-short {
    width: 45vw;
    max-width: 320px;
}
.frow__list--tokutei {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 18px;
}
.content-tokutei-l {
    width: 60vw;
    max-width: 430px;
    justify-content: flex-start;
}
.content-tokutei-r {
    display: flex;
    width: 60vw;
    max-width: 430px;
    justify-content: flex-end;
}
.frow_tokutei1 {
    position: relative;
}
.frow_tokutei1::after {
    content: '';
    background-image: url(../../images/frow_tokutei1.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 66px;
    height: 48px;
    position: absolute;
    right: 9px;
    top: -27px;
}
.frow_tokutei2 {
    position: relative;
}
.frow_tokutei2::after {
    content: '';
    background-image: url(../../images/frow_tokutei2.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 66px;
    height: 48px;
    position: absolute;
    left: -8px;
    top: 30px;
}
.frow_tokutei3 {
    position: relative;
}
.frow_tokutei3::after {
    content: '';
    background-image: url(../../images/frow_tokutei3.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 66px;
    height: 48px;
    position: absolute;
    left: 16px;
    top: 3px;
}
.frow_tokutei4 {
    position: relative;
}
.frow_tokutei4::after {
    content: '';
    background-image: url(../../images/frow_tokutei4.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 62px;
    height: 40px;
    position: absolute;
    right: 4%;
    top: 8px;
}


.frow__decoration-2::before {
    content: '';
    background-image: url(../../images/triangle_red_pc.svg);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    left: -16px;
    top: 13px;
}


.tokutei-txt-last {
    color: #EB8317;
    font-size: 1.8rem;
    font-weight: 700;
}
@media screen and (min-width: 999px) {
    .frow__title {
        margin-top: 70px;
    }
    .frow__contener {
        margin-top: 50px;
    }
    .frow_number {
        font-size: 4rem;
        margin-top: -15px;
    }
    .step {
        font-size: 1.6rem;
    }
    .frow__decoration {
        width: 80px;
        height: 80px;
        border: 6px solid #F1A550;
        position: static;
    }
    .frow__content {
        display: flex;
        align-items: center;
        margin: 28px auto;
        max-width: 1080px;
    }
    .frow__item--title {
        font-size: 2.4rem;
    }
    .frow__item--txt {
        font-size: 1.8rem;
        margin-top: 6px;
    }
    .frow__list {
        padding: 18px 30px;
        width: 80vw;
        max-width: 1000px;
        margin-top: 0;
    }

    .frow__list--tokutei {
        margin-top: 35px;
    }
    
    .frow__img {
        width: 153px;
        height: 124px;
        position: static;
    }
    .frow__list {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .frow__item {
        width: 78%;
    }
    .frow__title-1,
    .frow__title-2 {
        width: 285px;
        height: 125px;
    }
    .frow__title-1__sp,
    .frow__title-2__sp {
        display: none;
    }
    .frow__title-1__pc,
    .frow__title-2__pc {
        display: block;
    }
    .frow__title--content {
        max-width: 1300px;
    }
    .frow_tokutei1::after {
        width: 145px;
        height: 93px;
        right: 3%;
        top: -21px;
    }
    .frow_tokutei2::after {
        width: 145px;
        height: 93px;
        left: 3%;
        top: -21px;
    }
  
    .frow_tokutei3::after {
        width: 145px;
        height: 93px;
        left: 12%;
        top: -21px;
    }

    .frow_tokutei4::after {
        width: 145px;
        height: 93px;
        right: 12%;
        top: -21px;
    }
    

    .frow__decoration-1 {
        width: 80px;
        height: 80px;
        border: 6px solid #86B6E3;
    }
    .frow__decoration-1::after {
        width: 25px;
        height: 25px;
        position: absolute;
        right: -45px;
        top: 25px;
    }
    
    .frow__decoration-2 {
        width: 80px;
        height: 80px;
        border: 6px solid #E38686;
    }
    .frow__decoration-2::before {
        width: 25px;
        height: 25px;
        position: absolute;
        left: -45px;
        top: 25px;
    }
    .frow__tokutei-txt {
        font-size: 2.1rem;
        width: 60vw;
        max-width: 800px;
        min-height: 78px;
        padding: 25px;
    }
   
    .dceo {
        width: 80px;
    }
    .tokutei-container {
        max-width: 1100px;
    }
    .tokutei-txt-last {
        font-size: 2.8rem;
    }
    .frow__tokutei-txt-short {
        max-width: 550px;
    }
    .content-tokutei-l {
        max-width: 800px;
    }
    .content-tokutei-r {
        max-width: 800px;
    }
    



}