@charset "utf-8";

/* archive */
.project .title_area{background-image:url(/recruit/newgrads/img/common/h1_project.jpg);}
.project_list{padding:0;}
.project_item{
	list-style:none;
	margin-bottom:60px;
}
.project_link{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row-reverse;
	border-bottom-right-radius:30px;
	overflow:hidden;
	text-decoration:none !important;
}
.project_txt{
	display:flex;
	flex-shrink:0;
	flex-direction:column;
	justify-content:center;
	position:relative;
	width:470px;
	padding:50px 40px 75px;
	background:var(--color-darkgreen);
	transition:background 0.3s;
}
a:hover .project_txt{background:#00652F;}
.project_txt::before, .project_txt::after{
	content:'';
	position:absolute;
	bottom:30px;
	right:30px;
	width:28px;
	height:28px;
	transition:opacity 0.3s;
}
.project_txt::before{background:url(/recruit/newgrads/img/common/arrow_maru_r_white.svg) no-repeat center/cover;}
a:hover .project_txt::before{opacity:0;}
.project_txt::after{
	background:url(/recruit/newgrads/img/common/arrow_maru_r_green.svg) no-repeat center/cover;
	opacity:0;
}
a:hover .project_txt::after{opacity:1;}
.project_title{
	padding:0;
	margin:0 0 15px;
	color:#fff;
	font-family:var(--font-NotoSerif);
	font-size:2.6rem;
	letter-spacing:0;
	line-height:3.7rem;
}
.project_title::before{
	content:attr(data-number);
	display:block;
	position:static;
	width:100%;
	height:auto;
	padding:5px 10px 1px;
	margin-bottom:20px;
	background:#fff;
	color:var(--color-darkgreen);
	font-family:'Syncopate','Noto Sans CJK JP','Noto Sans JP',sans-serif;
	font-size:1.8rem;
	font-weight:bold;
	letter-spacing:0.18px;
	line-height:2.4rem;
	text-align:center;
}
.project_subtitle{
	color:#fff;
	font-size:1.8rem;
	font-weight:500;
	letter-spacing:1.44px;
	line-height:2.9rem;
	margin-bottom:30px;
}
.project_description{
	color:#fff;
	font-size:1.4rem;
	letter-spacing:1.12px;
	line-height:2.5rem;
	margin:0;
}
.project_description br{display:none;}
.project_thumb{
	width:calc(100% - 470px);
	overflow:hidden;
}
.project_img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform 0.3s;
}
a:hover .project_img{transform:scale(1.05);}
.project_img.size_tab{display:none;}


/* single */
.project_top{
	position:relative;
	margin-bottom:45px;
}
.project_top_box{
	position:absolute;
	z-index:1;
	bottom:0;
	left:0;
	width:100%;
	padding:40px;
	background:linear-gradient(180deg, rgba(24,24,24,0) 0%, #222222 100%);
}
.project_top_box .project_title{
	font-family:var(--font-NotoSans);
	font-size:3.8rem;
	line-height:5.3rem;
	margin-bottom:10px;
}
.project_top_box .project_title::before{
	width:auto;
	padding:0;
	margin-bottom:10px;
	background:none;
	color:#fff;
	font-size:2.2rem;
	letter-spacing:0.22px;
	line-height:3.2rem;
	text-align:left;
}
.project_top_box .project_subtitle{
	font-size:2.2rem;
	letter-spacing:0;
	line-height:3.2rem;
	margin:0;
}
.project_catch{width:100%;}
.project_catch.size_small{display:none;}

.project_post .content_area{
	max-width:none;
	padding:0;
}
.project_post .content_area > p{
	max-width:1220px;
	padding:0 20px;
	margin-right:auto;
	margin-left:auto;
	letter-spacing:0.16px;
}
.project_member{
	max-width:1220px;
	padding:0 20px;
	margin:0 auto 105px;
}
.project_member > p{
	font-size:1.2rem;
	letter-spacing:0.12px;
	line-height:1.7rem;
	text-align:center;
}
.project_member h2{
	padding:0;
	margin:70px 0 25px;
	color:#16A053;
	font-family:var(--font-Syncopate);
	font-size:2.2rem;
	font-weight:bold;
	letter-spacing:0;
	line-height:2.2rem;
}
.project_member h2::before{display:none;}
.member_list{
	display:grid;
	grid-template-columns:repeat(5, 1fr);
	grid-gap:30px 20px;
	padding:0;
	margin-bottom:45px;
}
.member_list li{
	list-style:none;
	margin:0;
}
.member_list p{margin-bottom:12px;}
.member_list p:not(:first-child){
	padding:0 10px;
	font-size:1.4rem;
	letter-spacing:0.14px;
	line-height:1.8rem;
}
.member_list span{
	display:block;
	font-size:1.6rem;
	font-weight:bold;
	letter-spacing:0.16px;
	line-height:2.4rem;
	margin-bottom:-5px;
}
.member_list span[data-company]::before{
	content:attr(data-company);
	display:block;
	font-size:1.4rem;
	letter-spacing:0.14px;
	line-height:2rem;
}

.content_box{border-top:1px solid #333;}
.content_box_in{
	max-width:1100px;
	padding:0 20px;
	margin:0 auto 80px;
}
.content_box_in:first-child > *:first-child{margin-top:145px;}
.column_top{
	display:flex;
	margin:145px 0 40px;
}
.column_top h2{
	flex-shrink:0;
	width:450px;
	padding:0;
	margin:0 40px 0 0;
	line-height:4.5rem;
}
.column_top h2::before{display:none;}
.column_top h2[data-theme]::before{
	content:attr(data-theme);
	display:block;
	position:static;
	width:auto;
	height:auto;
	margin:0 0 10px 40px;
	background:none;
	color:#008940;
	font-size:1.6rem;
	font-weight:400;
	letter-spacing:0.16px;
	line-height:2.4rem;
}
.column_top h2[data-theme]::after{
	content:'';
	position:absolute;
	top:12px;
	left:0;
	width:30px;
	height:1px;
	background:#008940;
}
.column_top p{letter-spacing:0.16px;}
.column_top p span{
	display:block;
	margin-top:20px;
	font-size:1.2rem;
	letter-spacing:0.12px;
	line-height:2.2rem;
}
.column_comment{
	display:flex;
	margin-top:55px;
}
.column_comment p{
	letter-spacing:0.16px;
	margin:0;
}
.column_comment p:first-child{
	flex-shrink:0;
	width:160px;
	margin:2px 30px 0 0;
}
.column_gallery{
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	grid-gap:30px;
	max-width:1500px;
	margin:auto;
}
.column_gallery p{margin:0;}
.column_gallery p:last-child{margin-top:140px;}
.slide_gallery img{width:500px;}
.project_flow{
	max-width:1220px;
	padding:0 20px;
	margin:auto;
}
.project_flow ol{
	counter-reset:flow;
	padding:50px 55px 60px;
	border:2px solid var(--color-darkgreen);
}
.project_flow li{
	display:flex;
	gap:30px;
	position:relative;
	counter-increment:flow;
	list-style:none;
	padding:0 0 40px 40px;
	margin:0 0 0 24px;
}
.project_flow li:last-child{padding-bottom:0;}
.project_flow li::before{
	content:counter(flow);
	display:flex;
	align-items:center;
	justify-content:center;
	position:absolute;
	top:0;
	left:-24px;
	width:50px;
	height:50px;
	padding-top:1px;
	background:#219858;
	border-radius:50%;
	color:#fff;
	font-family:var(--font-Syncopate);
	font-size:2.2rem;
	font-weight:bold;
	letter-spacing:0.22px;
}
.project_flow li::after{
	content:'';
	position:absolute;
	z-index:-1;
	top:10px;
	left:0;
	width:2px;
	height:calc(100% - 10px);
	background:var(--color-darkgreen);
}
.project_flow h3{
	padding:0;
	margin-top:8px;
	border:none;
	font-size:2.2rem;
	letter-spacing:0.22px;
	line-height:3.2rem;
}
.project_flow li > p{
	flex-shrink:0;
	width:350px;
	margin:0;
}

.project_outline{
	max-width:1220px;
	padding:0 20px;
	margin:145px auto 0;
}
.project_pickup{
	padding:50px 60px 55px;
	margin:-15px 0 30px;
	border:2px solid #008940;
}
.project_pickup h2, .pickup_profile h3{
	padding:0;
	margin:0;
	color:#16A053;
	font-family:var(--font-Syncopate);
	font-size:2.2rem;
	font-weight:bold;
	letter-spacing:0;
	line-height:2.8rem;
}
.project_pickup h2::before{display:none;}
.project_pickup > h3{
	padding:0;
	margin:15px 0;
	border:none;
	font-size:2.8rem;
	letter-spacing:0.28px;
	line-height:4rem;
}
.pickup_column{
	display:flex;
	margin-bottom:30px;
}
.pickup_column p{
	letter-spacing:0.16px;
	margin:0;
}
.pickup_column p:last-child{
	flex-shrink:0;
	width:350px;
	margin:3px 0 0 30px;
}
.pickup_profile{
	position:relative;
	min-height:280px;
	padding:40px 40px 40px 290px;
	background:#EBF5EE;
}
.pickup_profile h3{
	padding:0;
	margin:5px 0 10px;
	border:none;
}
.pickup_profile p{
	letter-spacing:0.16px;
	line-height:2.4rem;
	margin-bottom:10px;
}
.pickup_profile p:first-of-type{
	position:absolute;
	top:40px;
	left:40px;
	width:200px;
}
.pickup_profile p span{
	font-size:2rem;
	font-weight:bold;
	letter-spacing:0.2px;
	margin-right:12px;
}

.project_post #pankuzu{
	max-width:1220px;
	padding:0 20px;
	margin-right:auto;
	margin-left:auto;
}


@media screen and (max-width:1140px){

/* archive */
.project_description{display:none;}


}


@media screen and (max-width:1024px){

/* archive */
.project_txt{width:420px;}
.project_thumb{width:calc(100% - 420px);}


/* single */
.pickup_column{display:block;}
.pickup_column p:last-child{
	max-width:350px;
	width:auto;
	margin:20px auto 0;
}

}


@media screen and (min-width:768px) and (max-width:1024px){

/* archive */
.project_item::before{
	font-size:2.4rem;
	line-height:2.4rem;
}
.project_txt{padding:30px 25px 55px;}
.project_txt::before, .project_txt::after{
	bottom:20px;
	right:20px;
}
.project_title{
	font-size:2.4rem;
	line-height:3.4rem;
}
.project_subtitle{
	font-size:1.6rem;
	letter-spacing:1.28px;
	line-height:2.7rem;
	margin-bottom:25px;
}
.project_description{
	font-size:1.3rem;
	letter-spacing:1.04px;
	line-height:2.4rem;
}

/* single */
.project_top{margin-bottom:35px;}
.project_top_box{padding:30px;}
.project_top_box .project_title{
	font-size:3.3rem;
	line-height:4.6rem;
}
.project_top_box .project_title::before{
	font-size:1.8rem;
	letter-spacing:0.18px;
	line-height:2.5rem;
}
.project_top_box .project_subtitle{
	font-size:1.9rem;
	line-height:2.9rem;
}

.project_post .content_area > p{letter-spacing:0.15px;}
.project_member{margin-bottom:100px;}
.member_list{
	grid-template-columns:repeat(4, 1fr);
	margin-bottom:40px;
}
.member_list p:not(:first-child){padding:0;}

.content_box_in{margin-bottom:60px;}
.content_box_in:first-child > *:first-child{margin-top:105px;}
.column_top{
	display:block;
	margin:105px 0 35px;
}
.column_top h2{
	width:auto;
	margin:0 0 20px;
	font-size:2.8rem;
	letter-spacing:0.28px;
}
.column_top h2 br{display:none;}
.column_top p{letter-spacing:0.15px;}
.column_comment{margin-top:40px;}
.column_comment p{letter-spacing:0.15px;}
.column_comment p:first-child{
	width:120px;
	margin:4px 20px 0 0;
}

.column_gallery p:last-child{margin-top:80px;}
.project_flow ol{padding:40px 30px 50px;}
.project_flow li{
	padding-left:35px;
	margin-left:19px;
}
.project_flow li::before{
	top:-4px;
	left:-19px;
	width:40px;
	height:40px;
	font-size:1.9rem;
	letter-spacing:0.19px;
}
.project_flow h3{
	margin-top:4px;
	font-size:2rem;
	letter-spacing:0.2px;
	line-height:2.9rem;
}
.project_flow li > p{width:300px;}
.project_outline{margin-top:125px;}
.project_pickup{
	padding:40px 40px 35px;
	margin-top:-10px;
}
.pickup_column p{letter-spacing:0.15px;}
.pickup_profile{
	min-height:250px;
	padding:35px 30px 35px 240px;
}
.pickup_profile p{
	letter-spacing:0.15px;
	line-height:2.1rem;
}
.pickup_profile p:first-of-type{
	top:35px;
	left:30px;
	width:180px;
}
.pickup_profile p span{
	font-size:1.8rem;
	letter-spacing:0.18px;
}

}


@media screen and (max-width:900px){

/* archive */
.project_link{flex-direction:column-reverse;}
.project_txt{width:100%;}
.project_thumb{width:100%;}
.project_img.size_common{display:none;}
.project_img.size_tab{display:block;}

/* single */
.project_catch.size_large{display:none;}
.project_catch.size_small{display:block;}

}


@media screen and (max-width:767px){

/* archive */
.project_item{margin-bottom:55px;}
.project_item::before{
	font-size:2rem;
	line-height:2rem;
}
.project_link{border-bottom-right-radius:20px;}
.project_txt{padding:20px 15px 40px;}
.project_txt::before, .project_txt::after{
	bottom:15px;
	right:15px;
}
.project_title{
	font-size:2rem;
	line-height:2.9rem;
}
.project_title::before{margin-bottom:15px;}
.project_subtitle{
	font-size:1.4rem;
	letter-spacing:1.12px;
	line-height:2.5rem;
	margin-bottom:20px;
}
.project_description{
	font-size:1.2rem;
	letter-spacing:0.96px;
	line-height:2.2rem;
}
.project_img.size_common{display:block;}
.project_img.size_tab{display:none;}


/* single */
.project_top{
	display:flex;
	flex-direction:column-reverse;
	margin-bottom:25px;
}
.project_top_box{
	position:relative;
	bottom:auto;
	left:auto;
	padding:30px 20px 60px;
	background:#222;
}
.project_top_box::before{
	content:'';
	position:absolute;
	z-index:1;
	bottom:100%;
	left:0;
	width:100%;
	height:100px;
	background:linear-gradient(180deg, rgba(24,24,24,0) 0%, #222 100%);
}
.project_top_box .project_title{
	font-size:2.8rem;
	line-height:3.9rem;
	margin-bottom:20px;
}
.project_top_box .project_title::before{
	font-size:1.5rem;
	letter-spacing:0.15px;
	line-height:2rem;
}
.project_top_box .project_subtitle{
	font-size:1.6rem;
	line-height:2.5rem;
}

.project_post .content_area > p{
	letter-spacing:0.14px;
	line-height:2.8rem;
}
.project_member{margin-bottom:95px;}
.project_member h2{
	font-size:2rem;
	line-height:2rem;
	margin:55px 0 20px;
}
.member_list{
	grid-template-columns:repeat(2, 1fr);
	grid-gap:30px 15px;
	margin-bottom:35px;
}
.member_list p:not(:first-child){padding:0;}

.content_box_in{
	padding:0;
	margin-bottom:45px;
}
.content_box_in:first-child > *:first-child{margin-top:70px;}
.column_top{
	display:block;
	padding:0 20px;
	margin:70px 0 25px;
}
.column_top h2{
	width:auto;
	margin:0 0 15px;
	font-size:2.6rem;
	letter-spacing:0.26px;
	line-height:4.2rem;
}
.column_top h2 br{display:none;}
.column_top p{
	letter-spacing:0.14px;
	line-height:2.8rem;
}
.column_top p span{margin-top:15px;}
.column_comment{
	padding:0 20px;
	margin-top:25px;
}
.column_comment p{
	letter-spacing:0.14px;
	line-height:2.8rem;
}
.column_comment p:first-child{
	width:60px;
	margin:6px 15px 0 0;
}

.column_gallery{display:block;}
.column_gallery p{width:75%;}
.column_gallery p:last-child{margin:30px 0 0 auto;}
.project_flow ol{padding:30px 20px 40px;}
.project_flow li{
	display:block;
	padding:0 0 45px 30px;
	margin-left:17px;
}
.project_flow li::before{
	top:-4px;
	left:-17px;
	width:36px;
	height:36px;
	font-size:1.6rem;
	letter-spacing:0.16px;
}
.project_flow h3{
	margin:0 0 15px;
	font-size:1.8rem;
	letter-spacing:0.18px;
	line-height:2.6rem;
}
.project_flow li > p{width:auto;}

.project_outline{margin-top:105px;}
.project_pickup{
	padding:35px 20px 20px;
	margin:-5px 0 25px;
}
.project_pickup h2, .pickup_profile h3{
	font-size:2rem;
	line-height:2.4rem;
}
.project_pickup > h3{
	font-size:2.6rem;
	letter-spacing:0.26px;
	margin:20px 0;
}
.pickup_column{margin-bottom:25px;}
.pickup_column p{
	letter-spacing:0.14px;
	line-height:2.8rem;
}
.pickup_profile{
	min-height:220px;
	padding:30px 20px 30px 200px;
}
.pickup_profile p{
	letter-spacing:0.14px;
	line-height:1.8rem;
}
.pickup_profile p:first-of-type{
	top:30px;
	left:20px;
	width:160px;
}
.pickup_profile p span{
	font-size:1.6rem;
	letter-spacing:0.16px;
}

.slide_gallery img{width:300px;}

}


@media screen and (max-width:600px){

/* single */
.pickup_profile{padding:30px 20px 20px;}
.pickup_profile h3{
	margin:0 0 20px;
	text-align:center;
}
.pickup_profile p:first-of-type{
	position:static;
	margin:0 auto 30px;
}

}