*{
  box-sizing: border-box;
  background-repeat: no-repeat;
  margin: 0;
  padding: 0;
}

:root{
  --gothic: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  --mincho: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  --kozuka: "Kozuka Mincho Pr6N", "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  --english: "Abhaya Libre", serif;
  --blue: #739FFF;
}

body{
  background-color: #FAF9F9;
  font-family: var(--gothic);
font-size: 1.6rem;
}

li{
  list-style-type: none;
  position: relative;
}

p{
  line-height: 1.7em;
}

a{
  color: #000;
  position: relative;
  transition: 0.2s;
}

img{
  transition: 0.4s;
}

input,
textarea{
  font-family: var(--gothic);
  font-size: 1.5rem;
}

input[type="button"],
input[type="submit"],
button{
	cursor: pointer;
	transition: 0.2s;
}

input[type="button"]:hover,
input[type="submit"]:hover,
button:hover{
	opacity: 0.7;
}

::before,
::after{
  transition: 0.2s;
}

.outer{
	margin-left: auto;
	margin-right: auto;
	max-width: 1730px;
	width: calc(100% - 30px);
}

.inner{
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  width: calc(100% - 30px);
}

.inner_in{
	margin-left: auto;
	margin-right: auto;
	max-width: 800px;
	width: calc(100% - 30px);
}

.mincho{
  font-family: var(--mincho);
}

.kozuka{
  font-family: var(--kozuka);
}

.english{
  font-family: var(--english);
  line-height: 1em;
}

.center{
  text-align: center;
}
.right{
  text-align: right;
}

.bold{
  font-weight: 700px;
}

.mb-10{margin-bottom: 10px;}
.mb-20{margin-bottom: 20px;}
.mb-30{margin-bottom: 30px;}
.mb-40{margin-bottom: 4rem;}
.mb-50{margin-bottom: 5rem;}
.mb-60{margin-bottom: 6rem;}
.mb-70{margin-bottom: 7rem;}
.mb-80{margin-bottom: 8rem;}
.mb-90{margin-bottom: 9rem;}
.mb-100{margin-bottom: 10rem;}

.fw-500{font-weight: 500;}
.fw-600{font-weight: 600;}

.flex_box{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.flex_box.column_03::after{
  content: "";
  display: block;
  width: 32%;
}

.flex_box.column_02 .item{
  width: 48%;
}
.flex_box.column_03 .item{
  width: 32%;
}

.bg_white{
	background-color: #fff;
}

/*-- ↓under 767px↓ ------------------------------------- */
@media screen and (max-width:767.9px){
  /* html{
    font-size: 50%;
  } */
  
  .flex_box.column_03::after{
    display: none;
  }
  
  .flex_box.column_02 .item,
  .flex_box.column_03 .item{
    width: 100%;
  }
}

/*=================================

header

=================================*/
header.main_header{
	align-items: center;
	background-color: #fff;
	display: flex;
	height: 100px;
	justify-content: space-between;
	position: sticky;
	top: 0;
	left: 0;
	padding-left: 15px;
	z-index: 1000;
}

header.main_header .logo{
	line-height: normal;
	max-width: clamp(300px,22.66vw,435px);
	width: 100%;
}

header#corporate_header .logo,
header#individual_header .logo{
	max-width: clamp(280px,38.46vw,530px);
}

header#corporate_header .logo a,
header#individual_header .logo a{
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	font-size: clamp(1.2rem,1.46vw,1.5rem);
	font-weight: 500;
}

header#corporate_header .logo a span,
header#individual_header .logo a span{
	padding-bottom: 10px;
}

header.main_header .logo a{
	display: block;
	height: 100%;
}

header.main_header nav{
	height: 100%;
}

header.main_header nav > ul{
	align-items: stretch;
	display: flex;
	height: 100%;
}

header.main_header nav > ul > li{
	align-items: center;
	display: flex;
	flex-flow: column;
	justify-content: center;
}

header.main_header nav > ul > li > a,
header.main_header nav > ul > li > span{
	font-size: clamp(1.5rem,0.94vw,18px);
	font-weight: 500;
	margin: 0 clamp(2rem,2.08vw,4rem);
	transition: .2s;
}

header.main_header nav > ul > li:hover > a,
header.main_header nav > ul > li:hover > span,
header.main_header nav ul.level_02 li a:hover{
	color: var(--blue);
}

header.main_header nav ul.level_02{
	background-color: #fff;
	display: none;
	padding: 5px;
	position: absolute;
	left: 0;
	top: 75%;
	text-align: center;
	width: 100%;
}

header.main_header nav ul.level_02 li{
	border-top: 1px solid #D6D6D6;
}

header.main_header nav ul.level_02 li a{
	display: block;
	font-size: 90%;
	padding: 8px 0;
}

header.main_header nav .accordion:hover ul.level_02{
	display: block;
}


header#corporate_header,
header#individual_header{
	flex-flow: column;
	height: 140px;
	justify-content: space-between;
	padding-top: 5px;
	padding-left: 2.5rem;
	padding-right: 15px;
	padding-bottom: 20px;
}

header#corporate_header .row_01,
header#corporate_header .row_02,
header#individual_header .row_01,
header#individual_header .row_02{
	display: flex;
	justify-content: space-between;
	width: 100%;
}

header#corporate_header .row_01 ul,
header#individual_header .row_01 ul{
	align-items: center;
}

header#corporate_header .row_01 ul li:not(:last-child),
header#individual_header .row_01 ul li:not(:last-child){
	border-right: 1px solid #C3C3C3;
}

header#corporate_header .row_01 ul li a,
header#individual_header .row_01 ul li a{
	font-size: 1.5rem;
	margin: 0 clamp(2rem,1.56vw,3rem);
}

header#corporate_header .row_02 ul li a,
header#individual_header .row_02 ul li a{
	font-size: clamp(1.5rem, 1.2vw, 1.8rem);
    margin-left: 0;
    margin-right: clamp(2rem, 2vw, 6rem);
}


.hamburger_btn{
	display: none;
}

.hamburger_menu {
	display: none;
}

/*-- ↓under1024px↓ ------------------------------------- */
@media screen and (max-width: 1024px){
	header.main_header,
	header#corporate_header,
	header#individual_header{
		height: 70px;
	}
	
	header#corporate_header,
	header#individual_header{
		justify-content: center;
		padding-top: 0;
		padding-left: 15px;
		padding-bottom: 0;
	}
	
	header.main_header .logo{
		max-width: clamp(20rem, 29.3vw, 30rem);
	}
	
	header#corporate_header .logo a span,
	header#individual_header .logo a span{
		padding-bottom: 0;
		padding-left: 15%;
		position: relative;
    	top: -5px;
	}
	
	header.main_header nav,
	header .search_bar{
		display: none;
	}
	
	.hamburger_btn{
		display: block;
		height: 50px;
		position: absolute;
		top: 50%;
		right: 15px;
		transform: translateY(-50%);
		width: 50px;
	}
	
	.hamburger_btn span{
		background-color: var(--blue);
		display: block;
		height: 4px;
		position: relative;
		left: 10px;
		transition: 0.4s;
		width: 30px;
	}
	
	.hamburger_btn span:nth-child(1){
		top: 13px;
	}
	.hamburger_btn span:nth-child(2){
		top: 20px;
	}
	.hamburger_btn span:nth-child(3){
		top: 27px;
	}
	
	.hamburger_btn.active span:nth-child(1){
		top: 24px;
		transform: rotate(45deg);
	}
	
	.hamburger_btn.active span:nth-child(2){
		opacity: 0;
	}
	
	.hamburger_btn.active span:nth-child(3){
		top: 16px;
		transform: rotate(-45deg);
	}

	.hamburger_menu {
		display: block;
		max-height: 0;
		width: 100%;
		overflow: auto;
		transition: .4s;
		opacity: 0;
		background-color: #fff;
		position: fixed;
		top: 70px;
		left: 0;
		z-index: 1000;
	}

	.hamburger_menu.active {
		max-height: calc(100dvh - 70px);
		opacity: 1;
	}

	.hamburger_menu ul a,
	.hamburger_menu .accordion span {
		display: block;
		padding: 2.5rem 3.5rem 2.5rem;
		border-bottom: 1px solid #d9d9d9;
		position: relative;
		font-weight: 500;
	}

	.hamburger_menu ul a:before {
		content: "";
		position: absolute;
		left: 1.6rem;
		top: calc(50% - 3px);
		width: 6px;
		height: 6px;
		border-top: 1.5px solid #000;
		border-right: 1.5px solid #000;
		transform: rotate(45deg);
	}

	.hamburger_menu .accordion span {
		padding-left: 2rem;
	}

	.hamburger_menu .accordion span:before,
	.hamburger_menu .accordion span:after {
		content: "";
		position: absolute;
		top: calc(50% - 1px);
		right: 2rem;
		height: 2px;
		width: 20px;
		background-color: #000;
		transition: .3s;
	}

	.hamburger_menu .accordion span:after {
		transform: rotate(90deg);
		opacity: 1;
	}

	.hamburger_menu .accordion.active span:after {
		transform: rotate(0deg);
		opacity: 0;
	}

	.hamburger_menu .level_02 a {
		padding: 2rem 3.5rem 2rem;
		background-color: #f4f4f4;
	}

	.hamburger_menu .level_02 {
		transition: .2s;
		overflow: hidden;
		max-height: 0;
		opacity: 0;
	}

	.hamburger_menu .accordion.active .level_02 {
		max-height: 50rem;
		opacity: 1;
	}

	.hamburger_info {
		background-color: #f5faff;
		padding: 4rem 2rem 5rem;
	}

	.hamburger_info .name {
		font-size: 2rem;
		font-weight: 700;
		line-height: 1;
		text-align: center;
		margin-bottom: 1.3rem;
	}

	.hamburger_info address {
		font-size: 1.4rem;
		font-weight: 500;
		line-height: 1.5;
		text-align: center;
		margin-bottom: 2rem;
	}

	.hamburger_info a {
		display: block;
		width: 28rem;
		max-width: 100%;
		font-size: 1.4rem;
		font-weight: 500;
		line-height: 1.5;
		padding: 1.6rem 2rem;
		background-color: #fff;
		border: 1px solid #000;
		border-radius: 100px;
		margin: 0 auto 1rem;
		text-align: center;
		background-image: url(../img/common/icon_tel.svg);
		background-repeat: no-repeat;
		background-size: 1.4rem auto;
		background-position: 2rem center;
	}

	.hamburger_info p {
		font-size: 1.4rem;
		text-align: center;
	}
}


/*=================================

footer

=================================*/
.f_contact{
	background: linear-gradient(180deg,rgba(250, 249, 249, 1) 0%, rgba(250, 249, 249, 1) 50%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 100%);
	position: relative;
}

.f_contact::before{
	background-color: #000;
	content: "";
	height: 1.5px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 100%;
}

.f_contact .inner{
	background-color: #fff;
	border: 1.5px solid #000;
	border-radius: 50px;
	position: relative;
	padding: clamp(4rem,6vw,8rem) 0;
}

.f_contact .inner .head{
	font-size: clamp(1.6rem,2vw,2rem);
	margin-bottom: clamp(3rem,6vw,5.6rem);
	text-align: center;
}

.f_contact .inner .head .en{
	display: block;
	font-size: 240%;
	margin-bottom: 1rem;
}

.f_contact .contact_way {
	align-items: center;
}

.f_contact .inner .tel{
	width: 43%;
}

.f_contact .inner .mail{
	width: 50%;
}

.f_contact .inner .tel p:first-of-type {
	font-size: clamp(3rem,6vw,4.8rem);
	line-height: 1;
	margin-bottom: .2rem;
	white-space: nowrap;
}

.f_contact .inner .tel p:last-of-type {
	font-size: 1.6rem;
	line-height: 1.5;
}

.f_contact .inner .tel p:first-of-type span {
	display: inline-block;
	padding-left: .625em;
	background-image: url(../img/common/icon_tel.svg);
	background-repeat: no-repeat;
	background-size: .417em auto;
	background-position: left top 80%;
}

.f_contact .inner .mail a {
	display: block;
	padding: 2.3rem 2rem 2.3rem 4rem;
	border: 1.5px solid #000;
	background-color: #fff;
	border-radius: 100px;
	font-size: 2.4rem;
	line-height: 1.5;
	text-align: center;
	position: relative;
	transition: .2s;
}

.f_contact .inner .mail a:hover {
	padding: 2.3rem 1.5rem 2.3rem 4.5rem;
	opacity: .6;
}

.f_contact .inner .mail a:before {
	content: "";
	position: absolute;
	left: 3.8rem;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 2.8rem;
	height: 2.8rem;
	background-image: url(../img/common/icon_mail.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}



footer {
	padding-top: 6rem;
	background-color: #fff;
}

footer .company {
	display: flex;
	align-items: center;
	justify-content: start;
	margin-bottom: 5rem;
	flex-wrap: wrap;
}

footer .company .name {
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1;
	padding-bottom: 2rem;
	margin-right: 3.7rem;
}

footer .company address {
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
	margin-right: 7rem;
}

footer .company ul {
	display: flex;
	align-items: start;
	column-gap: 5rem;
	row-gap: .5rem;
}

footer .company ul a {
	padding-left: 1em;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 2;
	position: relative;
}

footer .company ul a:hover {
	opacity: .6;
}

footer .company ul a:before {
	content: "";
	width: .5rem;
	height: .5rem;
	border-top: 1.5px solid #000;
	border-right: 1.5px solid #000;
	transform: rotate(45deg);
	position: absolute;
	left: 0;
	top: calc(1em - .2em);
}

footer .flex_box {
	margin-bottom: 7rem;
}

footer .flex_box>.item {
	width: 46%;
	display: flex;
	flex-wrap: wrap;
	column-gap: clamp(3rem,5vw,7.8rem);
}

footer .flex_box>.item:nth-of-type(odd) .link_btn .site:after {
	color: #739FFF;
}

footer .flex_box>.item:nth-of-type(even) .link_btn .site:after {
	color: #dd6268;
}

footer .flex_box .link_btn {
	margin-bottom: 1.5rem;
	width: 100%;
}

footer .flex_box .link_btn .site {
	max-width: initial;
}

footer .flex_box .link_btn .site:after {
	content: "MORE";
	position: absolute;
	font-size: 1.6rem;
	top: 50%;
	right: 6rem;
	transform: translateY(-50%);
}

footer .flex_box ul a {
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 2;
	padding-left: 1.1875em;
	position: relative;
}

footer .flex_box ul a:hover {
	opacity: .6;
}

footer .flex_box>.item ul a:before {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
	left: 0;
	width: 5px;
	height: 5px;
	border-top: 1.5px solid #739FFF;
	border-right: 1.5px solid #739FFF;
}

footer .flex_box>.item:nth-of-type(even) ul a:before {
	border-color: #dd6268;
}

footer .copyright {
	font-size: 1.4rem;
	font-weight: 500;
	padding: 1.5rem 0 5rem;
	text-align: center;
	background-color: #FAF9F9;
	color: #939393;
}

@media screen and (max-width:767px) {
	.f_contact .contact_way {
		row-gap: 2rem;
	}

	.f_contact .inner .item {
		width: 100%;
	}

	.f_contact .inner .tel {
		text-align: center;
	}

	.f_contact .inner .mail a {
		font-size: 1.8rem;
	}

	.f_contact .inner .mail a:before {
		left: 3rem;
	}

	footer .company {
		flex-wrap: wrap;
	}

	footer .company address {
		width: 100%;
		margin: 0 0 2rem;
	}

	footer .flex_box {
		row-gap: 2rem;
		margin-bottom: 4rem;
	}

	footer .flex_box>.item {
		width: 100%;
	}
}


#page_top{
	height: 8.6rem;
	position: fixed;
	right: 1rem;
	bottom: 1rem;
	width: 8.6rem;
	z-index: 100;
}

#page_top a{
	align-items: center;
	background-color: #fff;
	border: 2px solid #000;
	border-radius: 999px;
	display: flex;
	flex-flow: column;
	font-size: 1.2rem;
	font-weight: 500;
	height: 100%;
	justify-content: center;
	line-height: 1em;
	text-align: center;
	width: 100%;
}

#page_top a:hover{
	background-color: #EAEAEA;
}

#page_top a img{
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
}

/*-- ↓under767px↓ ------------------------------------- */
@media screen and (max-width: 767.9px){
	#page_top{
		height: 7rem;
		width: 7rem;
	}
	
	#page_top a{
		font-size: 1rem;
	}
	
	#page_top a img{
		margin-top: 2px;
		max-width: 60%;
	}
}

/*=================================

sub_head

=================================*/
.sub_head{
	position: relative;
}

.sub_head::before{
	background-color: rgba(0,0,0,0.15);
	content: "";
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.sub_head .page_title{
	padding-left: 15px;
	padding-right: 15px;
	position: absolute;
	top: 50%;
	text-align: center;
	transform: translateY(-50%);
	width: 100%;
	z-index: 2;
}

.sub_head .page_title .english span{
	font-size: clamp(4rem,8.34vw,6.4rem);
	font-weight: 700;
	letter-spacing: 0.13em;
	line-height: 1em;
	margin-bottom: 3rem;
	padding: 8px 3rem;
	text-transform: uppercase;
}

.sub_head .page_title .jp span{
	font-size: 2rem;
	font-weight: 500;
	padding: 5px;
}

.sub_head .page_title span{
	background-color: #fff;
	display: inline-block;
}

/*-- ↓under767px↓ ------------------------------------- */
@media screen and (max-width: 767.9px){
	.sub_head{
		height: clamp(20rem,39.11vw,30rem);
	}
	
	.sub_head .img_box{
		height: 100%;
	}
	
	.sub_head .img_box img{
		height: 100%;
		object-fit: cover;
		width: 100%;
	}
	
	.sub_head .page_title .english span{
		margin-bottom: 1rem;
		padding: 2px 1.5rem;
	}
}


/*=================================

ページ共通パーツ

=================================*/
/*--------------------------
パンくず
--------------------------*/
.breadcrumbs {
	color: #989898;
	font-weight: 500;
	display: flex;
	align-items: center;
	margin-top: 2rem;
	margin-bottom: 2rem;
	font-size: 1.4rem;
}

.breadcrumbs span{
	color: #000;
	font-weight: 400;
}

.page-id-3 .breadcrumbs span:nth-child(2),
.error404 .breadcrumbs span:nth-child(2),
.archive .breadcrumbs span:nth-child(2){
	display: inline-block;
}

.breadcrumbs span:nth-child(2),
.category .breadcrumbs span:nth-child(2){
	display: none;
}
	

.breadcrumbs span a{
	color: #000;
	font-weight: 400;
}

.breadcrumbs span a::after{
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 8px;
	height: 11px;
	margin: 0 1.4rem;
	background: url(../img/common/icon_arrow-right.svg) no-repeat center center;
	background-size: contain;
}

.breadcrumbs span a:hover{
	text-decoration: underline;
}

.breadcrumbs .home{
	display: block;
	font-size: 0;
	width: 22px;
	margin-right: 22px;
	height: 18px;
	background: url(../img/common/icon_home.svg) no-repeat center center;
	background-size: contain;
}

.breadcrumbs .home::after{
	margin-left: calc(22px + 0.6rem);
    position: relative;
    top: 5px;
}

/*--------------------------
ボタン
--------------------------*/
.link_btn a,
.link_btn p{
	border-bottom: 2px solid #000;
	font-weight: 600;
	font-size: clamp(1.6rem,4vw,1.8rem);
	max-width: 37.5rem;
	text-align: left;
	padding: 2rem 4.5rem 2rem 1.6rem;
	position: relative;
	transition: 0.2s;
	width: 100%;
}


.link_btn a:hover,
a:hover .link_btn p{
  opacity: 0.5;
}

.link_btn a::before,
.link_btn p::before{
  background-image: url("../img/common/icon_arrows.svg");
  background-size: contain;
  content: "";
  height: 1.2rem;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 4rem;
}

.link_btn a span,
.link_btn p span{
  transition: 0.2s;
}

.link_btn a:hover span,
a:hover .link_btn p span{
  margin-left: 5px;
}


.link_btn.back a{
  padding: 2rem 1.6rem 2rem 5rem;
  text-align: right;
}

.link_btn.back a::before{
  left: 0;
  right: 5px;
  transform: translateY(-50%) scale(-1, 1);
}

.link_btn.back a:hover span{
  margin-left: 0px;
  margin-right: 5px;
}


/*=================================

フェードイン

=================================*/
/* --- 共通設定 --- */
.js-fade {
  opacity: 0;
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  will-change: opacity, transform;
}

.is-bottom { transform: translateY(30px); }
.is-left   { transform: translateX(-30px); }
.is-right  { transform: translateX(30px); }
.is-static { transform: none; }

/* --- （全方向共通） --- */
.js-fade.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}


/*=================================

実績パーツ

=================================*/
.works_parts{
	padding-top: 10rem;
	padding-bottom: 10rem;
}

.works_parts .item {
	background-color: #fff;
	border-radius: 10px;
	margin-bottom: 6rem;
	overflow: hidden;
}

.works_parts .item.coming_soon{
	pointer-events: none;
}

.works_parts .item.coming_soon::before{
	background-color: rgba(0,0,0,0.2);
	content: "";
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1;
}

.works_parts .item.coming_soon::after{
	font-size: clamp(4.5rem,3.33vw,5.5rem);
	color: #fff;
	content: "COMING SOON";
	font-family: var(--mincho);
	font-weight: 700;
	position: absolute;
	top: 40%;
	left: 0;
	text-align: center;
	width: 100%;
	z-index: 2;
}

.works_parts .item .img_box {
	border-radius: 10px 10px 0 0;
	display: block;
	overflow: hidden;
	position: relative;
}

.works_parts .item .img_box img{
	object-fit: cover;
	height: 100%;
	width: 100%;
}

.works_parts .item:hover .img_box img{
	transform: scale(1.15);
}

.works_parts .item .category{
	background-color: #FAF9F9;
	border-radius: 0 10px 0 0;
	position: absolute;
	bottom: 0;
	left: 0;
	width: clamp(24rem,60vw,30rem);
	z-index: 2;
}

.works_parts .item .category span{
	font-size: 2rem;
	font-weight: 700;
	display: block;
	padding: 1.5rem 8rem 1.5rem 0;
	position: relative;
}

.works_parts .item .category span::before{
	background-image: url("../img/common/icon_arrows.svg");
	background-size: contain;
	content: "";
	height: 1.2rem;
	position: absolute;
	top: 50%;
	right: 3rem;
	transform: translateY(-50%);
	width: 4rem;
}

.works_parts .category::before,
.works_parts .category::after{
	background-image: url(../img/top/radius-reverse_01.svg);
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	position: absolute;
	width: 1rem;
	height: 1rem;
}

.works_parts .category::before{
	left: -.2px;
	bottom: calc(100% - .2px);
}

.works_parts .category::after{
	left: calc(100% - .2px);
	bottom: -.2px;
}

/*-- ↓under767px↓ ------------------------------------- */
@media screen and (max-width: 767.9px){
	.works_parts .flex_box.column_02 .item{
		margin-bottom: 3rem;
		width: 49%;
	}
	
	.works_parts .item .category span{
		font-size: 1.6rem;
	}
}

/*-- ↓under500px↓ ------------------------------------- */
@media screen and (max-width: 500px){
	.works_parts .flex_box.column_02 .item{
		width: 100%;
	}
}


/*=================================

カタログパーツ

=================================*/
.catalog_parts hgroup{
	margin-bottom: 6.5rem;
	text-align: center;
}

.catalog_parts hgroup .en{
	font-family: var(--english);
	font-size: 4.8rem;
	font-weight: 700;
    letter-spacing: 0.01em;
	line-height: 1em;
    margin-bottom: 16px;
}

.catalog_parts hgroup h2{
	font-size: 16px;
	font-weight: 500;
}

.catalog_parts .bg{
	height: clamp(30rem,54.59vw,66.6rem);
}

.catalog_parts .bg img{
	background-size: cover;
	height: 100%;
	width: 100%;
}

.catalog_parts .outer{
	background-color: #fff;
	border-radius: 5rem;
	padding-top: 12rem;
	padding-bottom: 6rem;
	position: relative;
	margin-top: -15rem;
}

.catalog_parts .item{
	align-items: center;
	border: 1px solid #A7A7A7;
	border-radius: 10px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 4.5rem;
	padding: 4rem 3rem 4rem 4rem;
}

.catalog_parts .item .img_box{
	width: 38%;
}

.catalog_parts .item .text_box{
	width: 57%;
}

.catalog_parts .item h3{
	font-size: 2rem;
	line-height: 1.8em;
	margin-bottom: 5px;
}

.catalog_parts .item p{
	font-size: 1.5rem;
	margin-bottom: 20px;
}

.catalog_parts .item a{
	border: 1px solid #000;
	border-radius: 25px;
	display: block;
	font-size: 15px;
	font-weight: 500;
	margin-bottom: 15px;
	padding: 15px 2.5rem;
}
.catalog_parts .item a:last-child{
	margin-bottom: 0;
}

.catalog_parts .item a:hover{
	background-color: rgba(0,0,0,0.1);
}

.catalog_parts .item a::before{
	background-size: contain;
	background-position: center;
	content: "";
	display: inline-block;
	height: 20px;
	margin-right: 12px;
	vertical-align: middle;
	width: 22px;
}

.catalog_parts .item a.digital::before{
	background-image: url("../img/corporate/icon_book.svg");
}

.catalog_parts .item a.download::before{
	background-image: url("../img/corporate/icon_download.svg");
	height: 14px;
	width: 17px;
}

/*-- ↓under767px↓ ------------------------------------- */
@media screen and (max-width: 767.9px){
	.catalog_parts .outer{
		border-radius: 10px;
		padding-top: 8rem;
		padding-bottom: 4rem;
	}
	
	.catalog_parts  .item{
		align-items: flex-start;
		margin-bottom: 3rem;
		padding: 3rem 15px;
		position: relative;
	}
	
	.catalog_parts .item .img_box{
		position: absolute;
		top: 3rem;
		left: 15px;
		width: 10rem;
	}
	
	.catalog_parts .item .text_box{
		min-height: 13rem;
		width: 100%;
	}
	
	.catalog_parts .item .text_box h3,
	.catalog_parts .item .text_box p{
		padding-left: 11.5rem;
	}
	
	.catalog_parts .item .text_box p{
		min-height: 10rem;
	}
	
}

/*-- ↓under500px↓ ------------------------------------- */
@media screen and (max-width: 500px){
	
}

/*=================================

ブロックパーツ

=================================*/
.confirm_wrap{
	display: none;
}

.wp-block-search__label {
    width: auto !important;
}

h2.wp-block-heading{
	margin-top: 4rem;
	margin-bottom: 3rem;
}