@charset: "UTF-8";

/* common style */
h2{
	font-size: clamp(0px, calc(45 / 16) * 1rem, 64px);
	font-weight: bold;
	margin-top: 1.5rem;
}
a.external-link{
	position: relative;
}
a.external-link::after{
	content: url("/poc_img/external_link.svg");
	width: 1em; height: 1em;
	position: absolute;
	top: 0; right: -1.5em;
}

/* main visual */
#main_visual{
	position: relative;
	width: 100%;
	height: 26vw;
}
#main_visual_img{
	object-fit: cover;
	filter: opacity(0.5);
	background-color: white;
}
#catchcopy_wrapper{
	position: absolute;
	background-color: white;
	padding: 1.5rem 6rem 3rem;
	height: auto; width: auto;
	top: 50%; left: 50%;
	text-align: center;
	font-weight: 600;
	transform: translate(-50%, -50%);
	line-height: 1.3;
	box-shadow: 0px 10px 9px #00000033;
	border-radius: 0.5rem;
}
#catchcopy_poc{
	font-size: 1.5em;
}
#catchcopy_red{
	color: #E2451E;
}

/* nav bar */
.navbar{
	background-color: #F79030;
	text-align: center;
	padding: 0.625rem 0;
}
.navbar .btn{
	color: white;
	display: flex;
	align-items: center;
	padding: 0 2.55rem;
	line-height: 1.25;
}
.navbar .btn:not(:last-child){
	border-right: 1px white solid;
}

/* works list */
#works_list{
	background-color: #F3EEDB;
	padding: 3rem 0 4rem;
}
#works_list h2{
	font-size: clamp(0px, calc(41 / 16) * 1rem, 64px);
	font-weight: 700;
	margin-top: 2rem;
	margin-bottom: 3rem;
}
#works_list .company_name{
	font-size: clamp(0px, calc(41 / 16) * 1rem, 32px);
}
#works_list .desc-body{
	font-size: clamp(0px, calc(33 / 16) * 1rem, 16px);
	font-weight: 500;
	padding: 0;
}
.works-case{
	margin: 0 auto;
	display: flex;
	width: 55rem;
}
.works-case:not(:last-child){
	margin-bottom: 1.75rem;
}
.works-case .img-wrapper{
	background-color: white;
	border-radius: 10%;
	width: 8.0rem; height: 8.0rem;
	padding: 1rem;
	box-shadow: 0 0.125rem 0 #00000029;
	position: relative;
	
	display: flex;
	align-items: center;
	justify-content: center;
}
.works-case .img-wrapper img{
	width: 100%; height: 100%;
	margin: auto;
}
.works-case .desc-wrapper{
	margin-left: 1.75rem;
	max-width: 40rem;
}
.works-case .desc-wrapper .desc-header{
	font-size: clamp(0px, calc(33 / 16) * 1rem, 24px);
	font-weight: 500;
}
.works-case .desc-wrapper .desc-header .achive_number{
	color: black;
}
.works-case .desc-wrapper .desc-body{
	font-size: clamp(0px, calc(17 / 16) * 1rem, 64px);
	font-weight: 400;
	line-height: 1.7;
}

/* contact button */
.btn-submit{
	padding: 1.75rem 4.5rem;
	border-radius: 1.5rem;
}
.btn-chevron-down{
	position: relative;
	padding: 1.75rem 7rem 1.75rem 4.5rem;
}
.btn-chevron-down::after{
	content: "";
	position: absolute;
	background-color: white;
	width: 2rem;
	height: 1rem;
	top: 50%; right: 3%;
	transform: translate(-50%, -50%);
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
