@charset "UTF-8"; @media screen and (max-width: 768px) {
	
	
	#home_message.move .main_img.top p.img.img01,
	#home_message.move .main_img.top p.img.img02 {
		opacity: 1; 
		transform: translateY(0);
		transition: 0.6s ease-out .5s;
	}

	#home_message.move .main_img.top p.img.img03 {
		opacity: 1; 
		transform: translateY(0);
		transition: 0.6s ease-out .8s;
	}
	
	#home_message.move .main_img.bottom p.img.img01,
	#home_message.move .main_img.bottom p.img.img02{
		opacity: 1; 
		transform: translateY(0);
		transition: 0.6s ease-out 1.1s;
	}

    /***********************************************
    お知らせ　汎用
    ***********************************************/
    ul.cmn_people_list li .area_a p.img {
        padding-top: 40.9rem;
    }

    ul.cmn_people_list li .area_b {
        padding: 0 5rem 4rem;
        margin: -3rem auto 0;
    }

    ul.cmn_people_list li .area_b::after {
        width: 6.5rem;
        height: 6.5rem;
        background-size: 1.8rem;
        right: 3rem;
        bottom: 2.5rem;
    }

    ul.cmn_people_list li .area_b p.cat {
        font-size: 2.4rem;
        top: -2rem;
        padding: .6rem 3.2rem;
        margin-bottom: 0;
    }

    ul.cmn_people_list li .area_b h3.ttl {
        min-height: 16.2rem;
    }

    ul.cmn_people_list li .area_b h3.ttl a {
        font-size: 3.6rem;
        line-height: 1.5;
        text-align: left;
        -webkit-line-clamp: 3;
    }

    ul.cmn_people_list li .area_b p.initial {
        font-size: 2.4rem;
        text-align: left;
    }

    /***********************************************
汎用 先輩の声　スライダー
***********************************************/
	.cmn_job_staff_sp .swiper {
			width: 50rem;
			margin: 0 auto 9rem;
		}

    .cmn_job_staff_sp ul.cmn_people_list {
        display: flex;
        margin: 0 auto;
        gap: 0;
    }

    .cmn_job_staff_sp ul.cmn_people_list li {
        display: block;
    }

    .cmn_job_staff_sp p.btn a {
        padding-right: 14rem;
    }

    .cmn_job_staff_sp p.btn a span {
        font-size: 3.6rem;
        padding-bottom: 2rem;
    }

    .cmn_job_staff_sp p.btn a::after {
        width: 9rem;
        height: 9rem;
        background-size: 2.2rem;
        top: calc(50% - 1rem);
    }
    /***********************************************
お知らせ　汎用
***********************************************/
    ul.cmn_post_list {
        margin: 0;
    }

    ul.cmn_post_list li {
        padding: 2.9rem 2rem;
    }

    ul.cmn_post_list li .post_content {
        flex-direction: column;
        align-items: flex-start;
    }

    ul.cmn_post_list li .post_content .sub_wrap {
        align-items: center;
    }

    ul.cmn_post_list li .post_content p.cat {
        font-size: 2.1rem;
        padding: .1rem 2.2rem;
        border-radius: 10px;
    }

    ul.cmn_post_list li .post_content h3.ttl {
        margin-top: 2rem;
    }

    ul.cmn_post_list li .post_content h3.ttl a {
        font-size: 3rem;
        width: 100%;
        line-height: 1.75;
    }


    /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
インターンシップ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

    #intern_area .image_area.left {
        left: -5rem;
        top: 15rem;
    }

    #intern_area .image_area.left p.img {
        width: 26rem;
    }

    #intern_area .image_area.left p.staff_img {
        width: 24.4rem;
        margin-top: 19rem;
        margin-right: 0;
        margin-left: -5rem;
    }

    #intern_area .content_area p.main_lead {
        padding: 9rem 0 0;
        margin-bottom: 7rem;
		position: relative;
		z-index: 1;
    }

    #intern_area .content_area p.main_lead::after {
        width: 65.6rem;
        height: 16.2rem;
        top: -3rem;
        transform: translateX(-50%);
    }

    #intern_area .content_area p.main_lead span {
        font-size: 3.6rem;
        min-width: 58rem;
    }

    #intern_area .content_area h2.main_ttl {
        width: 66.5rem;
        margin-left: -2rem;
        margin-bottom: 7.5rem;
    }

    #intern_area .content_area .btn_wrap.f_wrap {
        z-index: 2;
        gap: 3rem;
    }

    #intern_area .content_area .btn_wrap.f_wrap p.btn a {
        font-size: 3.6rem;
        border-radius: 7.5px;
        min-width: 51rem;
        min-height: 12rem;
    }

    #intern_area .image_area.right {
        right: -8rem;
        top: 21rem;
    }

    #intern_area .image_area.right p.img {
        width: 28rem;
    }

    #intern_area .image_area.right p.staff_img {
        width: 14rem;
        margin-bottom: 28rem;
        margin-left: 7rem;
    }

    /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
SNS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
    #sns_area h2.main_ttl {
        font-size: 4.8rem;
        margin-bottom: 6rem;
    }

    #sns_area ul.sns_list::after {
        left: auto;
        right: 0;
        width: 57.9rem;
        height: 12.9rem;
        bottom: -9rem;
    }

    #sns_area ul.sns_list li {
        margin: -.5rem;
    }

    #sns_area ul.sns_list li a {
        border-width: 7px;
        width: 33.2rem;
        height: 33.2rem;
        padding-bottom: 2rem;
    }

    #sns_area ul.sns_list li a span.icon {
        width: 12.8rem;
        margin-bottom: 0;
    }

    #sns_area ul.sns_list li a span.txt {
        font-size: 2.6rem;
    }
    /*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
採用
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
    #recruit_area {
        padding-top: 15rem;
    }

    #recruit_area::after {
        background-image: url("../images/common/recruit/recruit_slider_sp.svg");
        height: 18.8rem;
        width: calc(196.9rem * 2);
        background-size: 196.9rem 18.8rem;
        bottom: 48rem;
    }

    slide {
        from {
            transform: translateX(0);
        }

        to {
            transform: translateX(-196.9rem);
        }
    }
	
	#recruit_area .rec_deco .deco.deco {
		z-index: 1;
	}
	
    #recruit_area .rec_deco .deco.deco01 {
        --w: 19.3rem;
        --h: 19.3rem;
        --x: 51rem;
        --y: 9rem;
    }

    #recruit_area .rec_deco .deco.deco02 {
        --w: 29.7rem;
        --h: 29.7rem;
        --x: -4rem;
        --y: 0rem;
    }

    #recruit_area .rec_deco .deco.deco03 {
        --w: 34.3rem;
        --h: 34.3rem;
        --x: -4rem;
        --y: 60rem;
    }

    #recruit_area .rec_deco .deco.deco04 {
        --w: 19.3rem;
        --h: 19.3rem;
        --x: 51rem;
        --y: 64rem;
    }

    #recruit_area .circle_bg {
        width: 66.5rem;
        height: 66.5rem;
        padding: 0 0 5rem 0;
    }

    #recruit_area .circle_bg h2.main_ttl {
        width: 69rem;
    }

    #recruit_area .inner {
        position: relative;
        margin-top: 9rem;
		z-index: 1;
    }

    #recruit_area .inner::before, #recruit_area .inner::after {
        position: absolute;
        content: '';
        background: no-repeat 50% / contain;
    }

    #recruit_area .inner::before {
        background-image: url("../images/common/recruit/recruit_staff01.png");
        width: 16.7rem;
        height: 44.5rem;
        bottom: 17rem;
        left: -2rem;
    }

    #recruit_area .inner::after {
        background-image: url("../images/common/recruit/recruit_staff02.png");
        width: 19.8rem;
        height: 44.2rem;
        bottom: 15rem;
        right: -3rem;
    }

    #recruit_area .inner .box {
        width: 55rem;
        margin: 0 auto;
        padding: 8rem 2rem 8rem;
    }
	
    #recruit_area .inner h3.ttl span.en {
        width: 24.6rem;
    }

    #recruit_area .inner h3.ttl span.ja {
        font-size: 3rem;
    }

    #recruit_area .inner .btn_wrap p.btn a {
        font-size: 3.2rem;
        width: 43rem;
        height: 12rem;
        border-radius: 6rem;
    }

    #recruit_area .inner .guide.box h3.ttl span.en {
        width: 23rem;
    }

    #recruit_area .inner .entry.box h3.ttl span.en {
        width: 26rem;
    }

    /*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
エントリー
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
    #entry_area {
        padding-bottom: 0;
        margin-bottom: -10rem;
        position: relative;
    }

    #entry_area .inner {
        background: #8CC63F;
        width: 55rem;
        margin: 0 auto;
        padding: 6rem 3rem;
    }

    #entry_area .inner .entry.box h2.main_ttl {
        margin-bottom: 5rem;
    }

    #entry_area .inner .entry.box h2.main_ttl > * {
        display: block;
        text-align: center;
    }

    #entry_area .inner .entry.box h2.main_ttl span.en {
        width: 26rem;
        margin: 0 auto 1.5rem;
    }

    #entry_area .inner .entry.box h2.main_ttl span.ja {
        color: #fff;
        font-size: 3rem;
    }

    #entry_area .inner .entry.box .btn_wrap {
        flex-direction: column;
        gap: 2rem;
        align-items: center;
    }

    #entry_area .inner .entry.box .btn_wrap p.btn a {
        font-size: 2.8rem;
        display: grid;
        align-items: center;
        justify-content: center;
        min-height: 10rem;
        border-radius: 5rem;
        background: #fff;
        width: 38rem;
        font-weight: bold;
    }

    #entry_area .inner .entry.box .btn_wrap p.btn.mynavi a img {
        width: 70%;
        margin: 0 auto;
    }

}