@charset "UTF-8";

html{
	scroll-behavior: smooth;
	overflow-x: hidden;
}
/** -----------------------------------------------
  セクション共通
------------------------------------------------**/
body {
	/*下記のCSSはご自身のデザインに合わせて書き換えてください。*/
	font-size: 20px;
	line-height: 1.6;
	color: #333;
	background-color:#fbfaf6;
	font-family: "筑紫A丸ゴシック","fot-tsukuardgothic-std", "sans-serif","Zen Maru Gothic","メイリオ", "Meiryo","ヒラギノ丸ゴ Pro W3", "Hiragino Maru Gothic Pro";
	font-weight: bold;
}

/*各セクションタイトル*/
.section-tittle{
	color: #f08300;
	font-size: 36px;
	letter-spacing: 0.05em;
	text-align: center;
}

/*各セクションのもっとみるボタン*/
.button{
	display: block;
	width: 308px;
	height: 72px;
	background-color: #7da950;
	color: #fbfaf6;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 0.05em;
	border-radius: 35px;
	text-align: center;
	line-height: 72px;
	text-decoration: none;
	box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);

}

.button:hover{
	background-color: #f08300;
}

/*各セクション内タイトル下のpタグ*/
.section-description{
	font-size: 20px;
	letter-spacing: 0.05em;
	text-align: center;
	padding-top: 60px;
}

.sp_section-description{
	display: none;
}

/*各セクションの最大幅を決める*/
.section-inner{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}




/** -----------------------------------------------
  PC :  画面の横幅が641px以上
------------------------------------------------**/
.pc-only{
	display: block;
}

.sp-only{
	display: none;
}




.header{
	background-color: #f08300;
	width: 100vw;
	height: 100px;
	padding: 0 54px;
	position: fixed;
	z-index: calc(infinity);


}

.header_inner{
	height: 100px;
	display: flex;
	justify-content:space-between;
	align-items: center;

}

.header_logo{
	align-items: center;
	justify-content: center;
}

.header_logo a{
	width: 220px;
}

.header_logo p{
	color: #fbfaf6;
	font-size: 24px;
	letter-spacing: 0.05em;
	margin-top: -16px;
	margin-bottom: 8px;
	text-align: center;

}

.gnav-pc-wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;

}

.gnav-pc li{
	margin-right: 24px;
	display: inline;
	list-style: none;
}

.gnav-pc a{
	color: #fbfaf6;
	font-size: 14px;
	text-decoration: none;
}

.gnav-pc a:hover{
	color: #333;
}

.entry_button{
	width: 156px;
	height: 60px;
	line-height: 60px;
	border-radius: 29px;
	background-color: #7da950;
	color: #fbfaf6;
	border: solid 1px #fbfaf6;
	text-align: center;
	text-decoration: none;
	margin-left: 24px;

}

.entry_button:hover{
	background-color: #fbfaf6;
	border: solid 1px #7da950;
	color: #7da950;
}





.sp_header_inner{
	display: none;
}

/*ハンバーガー*/
.sp_hamburger{
	display: none;
}
/*ハンバーガー終わり*/






/* font-family: "Cabin", sans-serif; あとで使う*/


/* MV */
.mv{
	width: 100vw;
	height: 1020px;
	background-image: url("../images/MV.png");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}


.copy-wrap{
	position: absolute;
	left: 220px;
	top: 900px;
}

.maincopy{
	color: #f08300;
	font-size: 55px;
	font-weight: bold;
	letter-spacing: 0.05em;
}

.sp_maincopy{
	display: none;
}



/* 私たちについて */
.about{
	padding: 120px 0 120px 0;
	height: 1250px;
	position: relative;
}




.copy{
	font-size: 25px;
	position: absolute;
	left: 22%;
	top: 400px;
}

.hand{
	width: 516px;
	height: 344px;

	position: absolute;
	left: 52%;
	top: 275px;
}

.about-description{
	font-size: 20px;
	letter-spacing: 0.05em;
	font-weight: bold;
	line-height: 3.0;
	text-align: center;
	position: absolute;
	bottom: 300px;
	left: 20%;
}
.sp_about-description{
	display: none;
}


.about-button{
	text-align: center;
	position: absolute;
	display: block;
	left: 40%;
	bottom: 120px;

}


/*画像*/
.babyfoot1{
	width: 100vw;
	height: 300px;
	background-image: url(../images/baby\ foot1.png);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}



/*事業について*/
.service{
	padding: 120px 0 120px 0;
	position: relative;
}

        /*カード1*/
.sv_card_item1{
	width: 1000px;
	height: 280px;
	background-color: #ffffff;
	display: flex;
	margin-top: 60px;
    border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.sp-card1{
	display: none;
}

.sv_card1_box{
	padding: 70px 80px 80px 80px;
}

.min-tittle1{
	display: flex;
}

.min-tittle1 img{
	width: auto;
	height: auto;
}

.card1_tittle{
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 0.05em;
}

.card1-text{
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0.05em;
	margin-top: 30px;
}

.sp_card1-text{
	display: none;
}

        /*カード2*/
.sv_card_item2{
	width: 1000px;
	height: 280px;
	background-color: #ffffff;
	display: flex;
	margin-top: 30px;
	border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.sp-card2{
	display: none;
}

.sv_card2_box{
	padding: 70px 90px 70px 80px;
}

.min-tittle2{
	display: flex;
}

.card2-tittle{
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 0.05em;
}

.card2-text{
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0.05em;
	margin-top: 30px;
}

.sp_card2-text{
	display: none;
}

        /*カード3*/
.sv_card_item3{
	width: 1000px;
	height: 280px;
	background-color: #ffffff;
	display: flex;
	margin-top: 30px;
    border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.sp-card3{
	display: none;
}

.sv_card3_box{
	padding: 70px 80px 80px 80px;
}

.min-tittle3{
	display: flex;
}

.card3_tittle{
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 0.05em;
}

.card3-text{
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0.05em;
	margin-top: 30px;
}

.sp_card3-text{
	display: none;
}

        /*ボタン*/
.service_button{
	margin-top: 80px;
}
.service-button{
	display: flex;
	justify-content: center;
	margin-top: 80px;
}





/*メンバー紹介*/
.member{
	position: relative;
	padding: 120px 0 120px 0;

}

.mem_card_wrap{
	display: flex;
	width: 1000px;
	justify-content: space-between;
	margin-top: 60px;
	/* うまく表示されなかった
	width: calc((100% - 180px)/4); */
}

.sp_mem_card_wrap{
	display: none;
}

	/* 女性1 */
.department1{
	font-size: 16px;
	letter-spacing: 0.05em;
	line-height: 1.6;
	margin-top: 16px;
	margin-left: 8px;
}

.name1{
	font-size: 16px;
	letter-spacing: 0.05em;
	margin-top: 12px;
	margin-left: 8px;
}

/* 女性2 */
.department2{
	font-size: 16px;
	letter-spacing: 0.05em;
	line-height: 1.6;
	margin-top: 16px;
	margin-left: 8px;
}

.name2{
	font-size: 16px;
	letter-spacing: 0.05em;
	margin-top: 12px;
	margin-left: 8px;
}

/* 女性3 */
.department3{
	font-size: 16px;
	letter-spacing: 0.05em;
	line-height: 1.6;
	margin-top: 16px;
	margin-left: 8px;
}

.name3{
	font-size: 16px;
	letter-spacing: 0.05em;
	margin-top: 12px;
	margin-left: 8px;
}

/* 女性4 */
.department4{
	font-size: 16px;
	letter-spacing: 0.05em;
	line-height: 1.6;
	margin-top: 16px;
	margin-left: 8px;
}

.name4{
	font-size: 16px;
	letter-spacing: 0.05em;
	margin-top: 12px;
	margin-left: 8px;
}

.sp_mem_picture{
	display: none;
}

.mem_picture{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 72px;
}



.member-button{
	display: flex;
	justify-content: center;
	margin-top: 80px;
}





/*働く環境*/
.work-environment{
	position: relative;
	padding: 120px 0 120px 0;
	background-color: #fbfaf6;
}

        /* 3カラム */
.col-3{
	display: flex;
	/* width: calc((100% - 32px)/3); */
	justify-content: space-between;
	margin-top: 60px;
}

		/* フレックスタイム制 */
.we_card1{
	background-color: #ffefe2;
	width: 320px;
	height: 430px;
	border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.we_card1_item{
	text-align: center;
	margin-top: 30px;
}

.we_card1_box{
	text-align: center;
}

.we_card1_box h3{
	font-size: 16px;
	margin-bottom: 16px;
	text-align: center;
}

.we_card1_box p{
	font-size: 14px;
	text-align: left;
	display: inline-block;
}

		/* 社内託児所 */
.we_card2{
	background-color: #ffefe2;
	width: 320px;
	height: 430px;
	border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.we_card2_item{
	text-align: center;
	margin-top: 30px;
}

.we_card2_box{
	text-align: center;
}

.we_card2_box h3{
	font-size: 16px;
	margin-bottom: 16px;
	text-align: center;
}

.we_card2_box p{
	font-size: 14px;
	text-align: left;
	display: inline-block;
}

		/* フルリモート */
.we_card3{
	background-color: #ffefe2;
	width: 320px;
	height: 430px;
	border-radius: 50px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
}

.we_card3_item{
	text-align: center;
	margin-top: 30px;
}

.we_card3_box{
	text-align: center;
}

.we_card3_box h3{
	font-size: 16px;
	margin-bottom: 16px;
	text-align: center;
}

.we_card3_box p{
	font-size: 14px;
	text-align: left;
	display: inline-block;
}


		/* ボタン */
.wv-button{
	display: flex;
	justify-content: center;
	margin-top: 80px;
}







/*募集職種*/
.recruit{
	width: 100vw;
	background-color: #ffefe2;
	padding: 120px 0 120px 0;
	position: relative;
}

.recruit_all{

}

.recruit_top{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;

}



.engineer{
	background-color: #fbfaf6;
	width: calc((100% - 96px)/3);
	line-height: 68px;
	border-radius: 0px;
	text-align: center;
	display: block;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

}

.director{
	background-color: #fbfaf6;
	width: calc((100% - 96px)/3);
	line-height: 68px;
	border-radius: 0px;
	text-align: center;
	display: block;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

}

.UIUX{
	background-color: #fbfaf6;
	width: calc((100% - 96px)/3);
	line-height: 68px;
	border-radius: 0px;
	text-align: center;
	display: block;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

}

.recruit_bottom{
	display: flex;
	justify-content: center;
	margin-top: 60px;
}

.marketer{
	background-color: #fbfaf6;
	width: 300px;
	height: 68px;
	border-radius: 0px;
	text-align: center;
	display: block;
	line-height: 68px;
	margin-right: 48px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

}

.customer_support{
	background-color: #fbfaf6;
	width: 300px;
	height: 68px;
	border-radius: 0px;
	text-align: center;
	display: block;
	line-height: 68px;
	box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

}





.sp_recruit_top{
	display: none;
}
.sp_recruit_second{
	display: none;
}
.sp_recruit_bottom{
	display: none;
}


.recruit-button{
	display: flex;
	justify-content: center;
	margin-top: 80px;
}


	/* 念の為のメモ書き(ボタンに使用していたCSS)
	position: absolute;
	left: 40%;
	bottom: 120px; */



/*選考フロー*/
.recruit2{
	padding: 120px 0 120px 0;
}

.flow-tittle{
	color: #333;
	font-size: 25px;
	letter-spacing: 0.05em;
	text-align: center;
	margin-bottom: 60px;
}

.rc2_card_wrap{
	background-color: #f3b296;
	display: flex;
	border-radius: 50px;
	justify-content: space-between;
	padding: 80px 50px;
	margin-bottom: 120px;
	box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);
}

.triangle{
	line-height: 320px;
}

.rc2_card{
	text-align: center;
}

.rc2_card_item{
	margin: 30px 0;
}


.sp_rc2_card_wrap{
	display: none;
}

.sp_writing{
	display: none;
}




.writing p{
	text-align: center;
	line-height: 1.75;
	letter-spacing: 0.06em;
}

.writing h3{
	text-align: center;
	margin: 72px 0 60px 0;
}


.final_entry-button{
	display: flex;
	justify-content: center;
}

.final-entry-button{
	display: block;
	width: 600px;
	line-height: 150px;
	background-color: #7da950;
	color: #fbfaf6;
	font-size: 40px;
	font-weight: bold;
	letter-spacing: 0.05em;
	border-radius: 35px;
	text-align: center;
	text-decoration: none;
	box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);
}

.final-entry-button:hover{
	background-color: #f08300;
	width: 650px;
}


.last_picture{
	width: 100vw;
	height: 460px;
	background-image: url("../images/footerpic.png");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.last_copy{
	position: absolute;
	left: 15%;
	top: 9515px;
}

.last_copy p{
	color: #fbfaf6;
	font-size: 70px;
}

.sp_last_copy{
	display: none;
}

/*フッター*/
.footer{
	width: 100vw;
	padding: 80px 390px;
	background-color: #f08300;
}

.footer_top_li ul{
	display: flex;
	list-style: none;
	font-size: 14px;
	justify-content: space-between;
}

.footer_top_li a{
	text-decoration: none;
	color: #fbfaf6;
}

.footer_top_li a:hover{
	text-decoration: underline;
}

.footer_button_p{
	color: #fbfaf6;
	margin-top: 20px;
}

.footer_button_p p{
	text-align: center;
	font-size: 14px;
}




/*ここからメディアクエリで各デバイスサイズに書き分けます。
今回の課題で考慮するのはPCとスマホのみでOKですが、タブレットサイズでのスタイルを書いてもOK！
また、CSSは上から下に継承されるので、変化させたいところだけ書けばOKです*/


/** -----------------------------------------------
  Smartphone :  画面の横幅が640pxまで
------------------------------------------------**/
@media screen and (max-width:640px){
	.pc-only{
		display: none;
	}

	.sp-only{
		display: block;
	}


	/* 共通設定 */

	.section-inner {
		width: 375px;
		max-width: 100%;
		margin: 0 auto;
		padding: 0 20px;
		font-size: 13px;
		color: #333;
	}

	.section-tittle{
		font-size: 25px;
	}

	.section-description{
		display: none;
	}

	.sp_section-description{
		display: block;
		font-size: 13px;
		letter-spacing: 0.05em;
		text-align: left;
		padding-top: 50px;
		padding-left: 30px;
		margin: 0 auto;
	}

	.button{
		display: block;
		width: 200px;
		height: 40px;
		background-color: #7da950;
		color: #fbfaf6;
		font-size: 14px;
		font-weight: bold;
		letter-spacing: 0.05em;
		border-radius: 30px;
		text-align: center;
		line-height: 40px;
		text-decoration: none;
		box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);
	}


	/* ヘッダー */

	.header{
		width: 100vw;
		height: 80px;
		padding: 0 30px;
		position: static;
	
	}

	.header_inner{
		display: none;
	}


	.sp_header_inner{
		height: 80px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.sp_header_logo{
		align-items: center;
		justify-content: center;
	}

	.sp_header_logo img{
		height: 20px;
	}

	.sp_header_logo p{
		color: #fbfaf6;
		font-size: 16px;
		letter-spacing: 0.05;
		margin-top: -16px;
		margin-bottom: 16px;
		text-align: center;
	}




/* sp用メニュー(使用しない)
	.menu-button{
		width: 35px;
		height: 50px;
		justify-content: center;
		align-items: center;
		z-index: 90;
		position: fixed;
	}

	.menu-button_inner span{
		height: 3px;
		width: 30px;
		background-color: #fbfaf6;
		position: absolute;
		right: 50px;
		display: block;
		border-radius: 2px;
	}

	.before{
		top: 25px;
	}

	.after{
		top: 55px
	}
*/


/*ハンバーガー*/
	.sp_hamburger{
		display: block;
	}
	/* overlay-styles.css */
	.hamburger-overlay {
		position: fixed;
		top: 20px;
		right: 20px;
		z-index: 1000;
		width: 48px;
		height: 48px;
		border: none;
		background: transparent;
		cursor: pointer;
		}

	.hamburger-overlay__line {
		position: absolute;
		left: 11px;
		width: 26px;
		height: 2px;
		background-color: #333;
		transition: all .6s;
		}

	.hamburger-overlay__line:nth-of-type(1) { top: 14px; }
	.hamburger-overlay__line:nth-of-type(2) { top: 23px; }
	.hamburger-overlay__line:nth-of-type(3) { top: 32px; }

	.hamburger-overlay.active .hamburger-overlay__line {
		background-color: #fbfaf6;
		}

	.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(1) {
		transform: translateY(9px) rotate(-45deg);
		}
	.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(2) {
		opacity: 0;
		}
	.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(3) {
		transform: translateY(-9px) rotate(45deg);
		}

	.nav-overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: #f08300;
		visibility: hidden;
		opacity: 0;
		transition: all .6s;
		z-index: 900;
		}

	.nav-overlay.active {
		visibility: visible;
		opacity: 1;
		}

	.nav-overlay__content {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		text-align: center;
		}

	.nav-overlay__list {
		margin: 0;
		padding: 0;
		list-style: none;
		}

	.nav-overlay__item {
		opacity: 0;
		transform: translateY(20px);
		transition: all .6s;
		}

	.nav-overlay.active .nav-overlay__item {
		opacity: 1;
		transform: translateY(0);
		}

	.nav-overlay.active .nav-overlay__item:nth-child(1) { transition-delay: 0.1s; }
	.nav-overlay.active .nav-overlay__item:nth-child(2) { transition-delay: 0.2s; }
	.nav-overlay.active .nav-overlay__item:nth-child(3) { transition-delay: 0.3s; }
	.nav-overlay.active .nav-overlay__item:nth-child(4) { transition-delay: 0.4s; }
	.nav-overlay.active .nav-overlay__item:nth-child(5) { transition-delay: 0.5s; }
	.nav-overlay.active .nav-overlay__item:nth-child(6) { transition-delay: 0.6s; }


	.nav-overlay__link {
		display: inline-block;
		padding: 16px;
		color: #fbfaf6;
		font-size: 16px;
		text-decoration: none;
		transition: color .3s;
		}

	.nav-overlay__link:hover {
		color: #333;
		}

	.nav_entry {
		width: 200px;
		line-height: 1.0;
		color: #fbfaf6;
		background-color: #7da950;
		border-radius: 40px;
		border: solid 1px #fbfaf6;
		text-align: center;
		margin: 20px auto;
	}

	.nav-overlay__item_e {
		text-decoration: none;
		list-style: none;
	}

	.nav_entry:hover{
		width: 250px;
	}


	.nav-overlay__item_e {
		opacity: 0;
		transform: translateY(30px);
		transition: all 2s;
		}

	.nav-overlay.active .nav-overlay__item_e {
		opacity: 1;
		transform: translateY(0);
		}
	

/*ハンバーガーcss終わり*/






	/* メインビジュアル */
	.mv{
		width: 100vw;
		height: 740px;
		background-image: url("../images/sp_mv.png");
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}

	.copy-wrap{
		position: absolute;
		left: 60%;
		top: 600px;
	}

	.maincopy{
		display: none;
	}

	.sp_maincopy{
		display: block;
		color: #f08300;
		font-size: 25px;
		font-weight: bold;
		letter-spacing: 0.05em;
	}




	/* 私たちについて */
	.about{
		padding: 80px 0;
		height: auto;
		position: relative;
	}

	.hand{
		position: static;
		height: auto;
		margin-top: 48px;
	}

	.hand img{
	width: 335px;
	}

	.copy{
		font-size: 18px;
		position: static;
		text-align: center;
		margin: 40px 0;
	}

	.about-description{
		display: none;
	}

	.sp_about-description{
		display: block;
		font-size: 15px;
		line-height: 2.6;
		text-align: left;
		position: static;
		padding-left: 40px;
		padding-bottom: 30px;
		margin: 0 auto;
		
	}

	.about-button{
		justify-content: center;
		position: static;
		display: flex;
		margin-top: 40px;
	}



	/* 写真 */
	.babyfoot1{
		display: none;
	}
	



/* 事業について */
	.service{
		padding: 80px 0;
	}

/* カード1 */
	.pc-card1{
		display: none;
	}
	.sp-card1{
		display: block;
	}

	.sv_card_item1{
		width: 335px;
		height: 370px;
		background-color: #ffffff;
		display: block;
		border-radius: 50px;
		margin-top: 30px;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}

	.sv_card1_box{
		padding: 30px 30px 40px 30px;
	}

	.min-tittle1{
	
	}

	.min-tittle1 img{
		width: 40px;
		height: 28px;
	}

	.card1_tittle{
		font-size: 15px;
	}

	.card1-text{
		display: none;
	}

	.sp_card1-text{
		display: block;
		font-size: 13px;
		margin-top: 16px;
		font-weight: bold;
		letter-spacing: 0.05em;
		
	}

/* カード2 */
	.pc-card2{
		display: none;
	}
	.sp-card2{
		display: block;
	}

	.sv_card_item2{
		width: 335px;
		height: 370px;
		background-color: #ffffff;
		display: block;
		border-radius: 50px;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}

	.sv_card2_box{
		padding: 30px 30px 40px 30px;
	}


	.min-tittle2 img{
		width: 40px;
		height: 28px;
	}

	.card2_tittle{
		font-size: 15px;
	}

	.card2-text{
		display: none;
	}

	.sp_card2-text{
		display: block;
		font-size: 13px;
		margin-top: 16px;
		font-weight: bold;
		letter-spacing: 0.05em;
		
	}

/* カード3 */
	.pc-card3{
		display: none;
	}

	.sp-card3{
		display: block;
	}

	.sv_card_item3{
		width: 335px;
		height: 370px;
		background-color: #ffffff;
		display: block;
		border-radius: 50px;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}






	.sv_card3_box{
		padding: 30px 30px 40px 30px;
	}


	.min-tittle3 img{
		width: 40px;
		height: 28px;
	}

	.card3_tittle{
		font-size: 15px;
	}

	.card3-text{
		display: none;
	}

	.sp_card3-text{
		display: block;
		font-size: 13px;
		margin-top: 16px;
		font-weight: bold;
		letter-spacing: 0.05em;
		
	}

	/*ボタン*/
	.service-button{
		display: flex;
		justify-content: center;
		margin-top: 40px;
	}




	/* メンバー紹介 */
	.member{
		position: static;
		padding: 80px 0;
	}

	.mem_card_wrap{
		display: none;
	}

	.sp_mem_card_wrap{
		display: block;
		margin-top: 30px;
	}

	.sp_mem-card1_2{
		display: flex;
		justify-content: space-between;
	}
	.sp_mem-card1 .sp_mem-card2{
		border-radius: 25px;
	}

	/* 女性1 */
	.sp_department1{
		font-size: 13px;
		letter-spacing: 0.05em;
		line-height: 1.4;
		margin-left: 8px;
	}

	.sp_name1{
		font-size: 13px;
		letter-spacing: 0.05em;
		margin-top: 8px;
		margin-left: 8px;
	}

	/* 女性2 */
	.sp_mem-card2{
		margin-left: 24px;
	}

	.sp_department2{
		font-size: 13px;
		letter-spacing: 0.05em;
		line-height: 1.4;
		margin-left: 8px;
	}

	.sp_name2{
		font-size: 13px;
		letter-spacing: 0.05em;
		margin-top: 8px;
		margin-left: 8px;
	}


	.sp_mem-card3_4{
		display: flex;
		margin-top: 24px;
		justify-content: space-between;
	}
	.sp_mem-card3 .sp_mem-card4{
		border-radius: 25px;
	}

	/* 女性3 */
	.sp_department3{
		font-size: 13px;
		letter-spacing: 0.05em;
		line-height: 1.4;
		margin-left: 8px;
	}

	.sp_name3{
		font-size: 13px;
		letter-spacing: 0.05em;
		margin-top: 8px;
		margin-left: 8px;
	}

	/* 女性4 */
	.sp_mem-card4{
		margin-left: 24px;
	}

	.sp_department4{
		font-size: 13px;
		letter-spacing: 0.05em;
		line-height: 1.4;
		margin-left: 8px;
	}

	.sp_name4{
		font-size: 13px;
		letter-spacing: 0.05em;
		margin-top: 8px;
		margin-left: 8px;
	}

	.sp_mem_picture{
		display: block;
		text-align: center;
		justify-content: center;
		margin-top: 40px;
	}
	.sp_mem_picture img{
		border-radius: 25px;
	}

	.mem_picture {
		display: none;
	}

	.member-button{
		display: flex;
		justify-content: center;
		margin-top: 40px;
	}



	/*働く環境*/
	.work-environment{
		padding: 80px 0;
		background-color: #fbfaf6;
	}


	.col-3{
		display: block;
		width: 100%;
		height: 372px;
		background-color: #ffefe2;
		border-radius: 50px;
		margin-top: 32px;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}

			/* フレックスタイム制 */
	.we_card1{
		box-shadow: none;
		width: unset;
		height: unset;
		background-color: unset;
		display: flex;

	}

	.we_card1_item{
		text-align: left;
		margin-top: 22px;
		margin-left: 20px;
	}
	.we_card1_item img{
		width: 96px;
		height: 96px;
	}

	.we_card1_box{
		text-align: left;
		margin: 30px 18px 0 16px;
	}

	.we_card1_box h3{
		font-size: 13px;
		margin-bottom: 8px;
		text-align: left;
	}

	.we_card1_box p{
		font-size: 10px;
		text-align: left;
		display: inline-block;
	}

			/* 社内託児所 */
	.we_card2{
		box-shadow: none;
		width: unset;
		height: unset;
		background-color: unset;
		display: flex;

	}

	.we_card2_item{
		text-align: left;
		margin-left: 20px;
		margin-top: 12px;
	}

	.we_card2_item img{
		width: 96px;
		height: 96px;
	}

	.we_card2_box{
		text-align: left;
		margin: 20px 18px 0 16px;
	}

	.we_card2_box h3{
		font-size: 13px;
		margin-bottom: 8px;
		text-align: left;
	}

	.we_card2_box p{
		font-size: 10px;
		text-align: left;
		display: inline-block;
	}

			/* フルリモート */
	.we_card3{
		box-shadow: none;
		width: unset;
		height: unset;
		background-color: unset;
		display: flex;
	}

	.we_card3_item{
		text-align: left;
		margin-top: 12px;
		margin-left: 20px;
	}

	.we_card3_item img{
		width: 96px;
		height: 96px;
	}

	.we_card3_box{
		text-align: left;
		margin: 24px 18px 0 16px;
	}

	.we_card3_box h3{
		font-size: 13px;
		margin-bottom: 8px;
		text-align: left;
	}

	.we_card3_box p{
		font-size: 10px;
		text-align: left;
		display: inline-block;
	}


			/* ボタン */
	.wv-button{
		display: flex;
		justify-content: center;
		margin-top: 40px;
	}




	/*募集職種*/
	.recruit{
	width: 100vw;
	background-color: #ffefe2;
	padding: 80px 0 80px 0;
	}

	.recruit_top{
		display: none;
		justify-content: unset;
		margin-top: unset;
	}

	.sp_recruit_top{
		display: flex;
		justify-content: space-between;
		margin-top: 30px;
	}

	.sp_engineer{
		background-color: #fbfaf6;
		width: calc((100% - 10px)/2);
		line-height: 40px;
		border-radius: 0px;
		text-align: center;
		display: block;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

	}

	.sp_director{
		background-color: #fbfaf6;
		width: calc((100% - 10px)/2);
		line-height: 40px;
		border-radius: 0px;
		text-align: center;
		display: block;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

	}

	.recruit_bottom{
		display: none;
		justify-content: unset;
		margin-top: unset;
	}

	.sp_recruit_second{
		display: flex;
		justify-content: space-between;
		margin-top: 20px;
	}

	.sp_marketer{
		background-color: #fbfaf6;
		width: calc((100% - 10px) / 2);
		line-height: 40px;
		border-radius: 0px;
		text-align: center;
		display: block;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}

	.sp_UIUX{
		background-color: #fbfaf6;
		width: calc((100% - 10px) / 2);
		line-height: 40px;
		border-radius: 0px;
		text-align: center;
		display: block;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);
	}


	.sp_recruit_bottom{
		display: flex;
		justify-content: center;
		margin-top: 20px;
	}

	.sp_customer_support{
		background-color: #fbfaf6;
		width: 50%;
		line-height: 40px;
		border-radius: 0px;
		text-align: center;
		display: block;
		box-shadow: 2px 0px 7px rgb(240, 131, 0, 0.3);

	}

	.recruit-button{
		display: flex;
		justify-content: center;
		margin-top: 40px;
	}




	/*選考フロー*/
	.recruit2{
		padding: 80px 0 80px 0;
	}

	.flow-tittle{
		font-size: 20px;
		margin-bottom: 50px;
	}

	.rc2_card_wrap{
		display: none;
	}

	.sp_rc2_card_wrap{
	display: block;
	background-color: #f3b296;
	border-radius: 50px;
	justify-content: unset;
	padding: 30px;
	margin-bottom: 50px;
	box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);
}

	.sp_rc2_card{
		display: flex;
		background-color: #fbfaf6;
		width: 275px;
		align-items: center;
		border-radius: 27px;
		padding: 12px 32px;
	}

	.sp_rc2_cardnumber{
		height: 30px;
	}
	.sp_rc2_card_description{
		margin-left: 50px;
	}

	.sp_triangle{
		line-height: 28px;
}

	.sp_triangle img{
		margin: auto;
		display: block;
		padding: 10px 0;
	}

	.writing{
		display: none;
	}

	.sp_writing{
		display: block;
	}

	.sp_writing p{
		text-align: center;
		letter-spacing: 0.06em;
		line-height: 1.75;
	}

	.sp_writing h3{
		text-align: center;
		margin: 32px 0 25px 0;
	}

	.final-entry-button{
		width: 260px;
		line-height: 64px;
		font-size: 18px;
		border-radius: 33px;
		text-align: center;
		text-decoration: none;
		box-shadow: 2px 0px 7px rgb(47, 35, 31, 0.15);
	}

	.last_picture{
		width: 100vw;
		max-height: 224px;
		background-image: url("../images/sp_footerpic.png");
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}


	.last_copy{
		display: none;
	}

	.sp_last_copy{
		display: block;
		position: absolute;
		left: 5%;
		top: 7300px; 
	}

	.sp_last_copy p{
		color: #fbfaf6;
		font-size: 20px;
	}




	/*フッター*/
	.footer{
		width: 100vw;
		padding: 30px 20px;
	}

	.footer_top_li ul{
		display: block;
		font-size: 10px;
		justify-content: unset;
	}

	.footer_button_p{
		margin-top: unset;
	}

	.footer_button_p p{
		text-align: unset;
		font-size: 10px;
	}



}









/*


















