/* ------------------------------------------------------------
lower common
---------------------------------------------------------------*/
main {
	padding-top: 130px;
}

.sec-lower-heading {
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	padding: 0 6.94%;
	padding-top: 80px;
	padding-bottom: 80px;
}

.sec-lower-heading .sec-inner {
	max-width: 1140px;
	height: 100%;
}

.lower-heading-flex {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 50px;
}

.lower-contents-wrapper {
	width: 100%;
	padding: 0 3.47%;
	padding-top: 80px;
	padding-bottom: 80px;
	position: relative;
	max-width: 1440px;
	margin: 0 auto;
	margin-bottom: 100px;
	overflow: hidden;
}
.lower-contents-wrapper::after {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	width: calc(100% - 6.94%);
	height: 100%;
	background: rgb(0 0 0 / 5%);
	overflow: hidden;
	backdrop-filter: brightness(0.8) blur(30px);
	z-index: 0;
	border-radius: 30px;
}
.lower-contents-wrapper > section {
	width: 100%;
	position: relative;
	overflow: hidden;
}
.lower-contents-wrapper > section .sec-inner {
	max-width: 940px;
}

.sec-lower-main-ttl {
	padding: 0 30px;
	padding-bottom: 40px;
}
.page-contact .sec-lower-main-ttl{
 padding-bottom: 0;
}

.lower-main-ttl {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	text-align: center;
	position: relative;
	gap: 10px;
}
.lower-main-ttl > h3 {
	width: 100%;
	font-size: 40px;
	font-weight: 700;
}
.lower-main-ttl > h3.--en {
	width: 100%;
	font-size: 50px;
	font-family: var(--font-sora);
	line-height: 1.26;
	font-weight: 400;
}

@media screen and (max-width: 1400px) {
	.lower-heading-flex {
		padding: 0 4.38%;
	}
}
@media screen and (max-width: 1200px) {
	.lower-main-ttl > h3 {
		font-size: 30px;
	}
	.lower-main-ttl > h3.--en {
		font-size: 40px;
	}
}
@media screen and (max-width: 999px) {
	main {
		padding-top: 80px;
	}
	.sec-lower-heading {
		padding: 0 30px;
		padding-top: 50px;
		padding-bottom: 30px;
	}

	.lower-heading-flex {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-flow: column;
		gap: 30px;
		padding: 0;
	}

	.lower-contents-wrapper {
		padding-left: 0;
		padding-right: 0;
	}
	.lower-contents-wrapper::after {
		width: 100%;
	}

	.sec-lower-main-ttl {
		padding: 0 30px;
		padding-bottom: 40px;
	}

	.lower-main-ttl {
		gap: 50px;
		align-items: flex-start;
		text-align: left;
	}
	.lower-main-ttl > h3 {
		font-size: 24px;
	}
	.lower-main-ttl > h3.--en {
		font-size: 28px;
	}
	.sec-lower-main-ttl .c-txt-sm {
		width: 100%;
	}
}
@media screen and (max-width: 768px) {
	.sec-lower-main-ttl .c-txt-sm {
		line-height: 3;
	}
}
@media screen and (max-width: 500px) {
}

/* ------------------------------------------------------------
Company
---------------------------------------------------------------*/
.sec-overview {
	padding: 0 30px;
	padding-top: 40px;
}
.map-group {
	width: 100%;
	display: flex;
	flex-flow: column;
	gap: 20px;
	align-items: flex-start;
}
.map-link {
	display: none;
}
.map-wrapper {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	aspect-ratio: 710 / 250;
	overflow: hidden;
}
.map-wrapper iframe {
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 999px) {
	.sec-overview .sub-ttl {
		width: 100%;
	}
}
@media screen and (max-width: 768px) {
	.map-wrapper {
		display: none;
	}
	.map-group {
		gap: 10px;
	}
	.map-link {
		display: block;
		font-size: 14px;
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 0.048em;
		line-height: 1.8;
		text-align: left;
		word-break: break-all;
	}
}

/* ------------------------------------------------------------
Service
---------------------------------------------------------------*/
.sec-merit {
	padding: 0 30px;
	padding-top: 40px;
	padding-bottom: 40px;
}
.merit-grid {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.merit-grid-item {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	gap: 30px;
}

.merit-grid-item > figure {
	width: auto;
	height: 80px;
	aspect-ratio: 1 / 1;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	flex-shrink: 0;
}
.merit-grid-item > figure img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.merit-grid-item > div {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	gap: 20px;
}
.merit-grid-item > div > p {
	width: 100%;
}

@media screen and (max-width: 999px) {
	.merit-grid {
		grid-template-columns: repeat(2, 1fr);
		max-width: 500px;
		margin: 0 auto;
		gap: 40px 20px;
	}
	.merit-grid-item > figure {
		height: 70px;
	}
}
@media screen and (max-width: 500px) {
	.merit-grid {
		grid-template-columns: repeat(1, 1fr);
		gap: 50px;
		max-width: 300px;
	}
	.merit-grid-item > div {
		gap: 15px;
	}
}

.sec-process {
	padding: 0 30px;
	padding-top: 40px;
}
.process-tab-area {
	width: 100%;
	position: relative;
	overflow: hidden;
}
.process-tab-box {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	gap: 50px;
}
.process-tab-heading-wrapper {
	width: 100%;
	position: relative;
}
.process-tab-heading {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 40px;
}
.process-tab-heading label {
	width: 100%;
	max-width: 156px;
	border: 1px solid var(--c-white-30);
	padding: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	gap: 15px;
	height: auto;
	aspect-ratio: 156 / 146;
	border-radius: 10px;
	cursor: pointer;
	transition: all ease 0.33s;
	position: relative;
	opacity: 0.5;
}
.process-tab-heading label::before {
	content: "";
	width: 10px;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 999px;
	position: absolute;
	left: calc(100% + 15px);
	background: var(--c-white-30);
}
.process-tab-heading label:last-of-type::before {
	content: none;
}
.process-tab-heading label:hover {
	opacity: 0.7;
}
.process-tab-heading label.tab-is-active {
	border: 1px solid var(--c-white);
	opacity: 1;
}
.process-tab-heading label.tab-is-active::after {
	content: "";
	width: 1px;
	height: 50px;
	background: var(--c-white);
	position: absolute;
	top: 100%;
}
.process-tab-heading label > div {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: flex-start;
	height: 84px;
	gap: 15px;
}
.process-tab-heading label > div > p {
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}
.process-tab-heading label > div > span {
	font-size: 16px;
	text-align: center;
	text-wrap: nowrap;
	font-family: var(--font-sora);
}
.process-panel-container {
	width: 100%;
	border-radius: 10px;
	border: 1px solid var(--c-white);
}
.process-panel-inner {
	width: 100%;
	padding: 30px;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 20px;
}

@media screen and (max-width: 1100px) {
	.process-tab-heading {
		gap: 35px;
	}
	.process-tab-box {
		gap: 30px;
	}
	.process-tab-heading-wrapper {
		overflow-x: auto;
		overflow-y: hidden;
	}
	.process-tab-heading label.tab-is-active::after {
		content: none;
	}
}

/* ------------------------------------------------------------
Technologies
---------------------------------------------------------------*/
.sec-technologies {
	padding: 0 30px;
	padding-top: 40px;
}
.sec-technologies .sec-col {
	gap: 80px;
}
.tech-note {
	width: 100%;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.048em;
}
.technologies-grid {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 80px;
}

.tech-grid-item-row {
	width: 100%;
	display: flex;
	align-items: flex-start;
	gap: 50px;
}

.tech-grid-item-row > figure {
	width: 200px;
	height: auto;
	aspect-ratio: 1 / 1;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	flex-shrink: 0;
}
.tech-grid-item-row > figure img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.tech-grid-item-row > div {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 20px;
}
.tech-grid-item-row .h3-box {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--c-white-30);
}

.tech-exp-group {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 10px;
}
.tech-exp-group > p {
	width: 100%;
}

@media screen and (max-width: 999px) {
	.tech-grid-item-row > figure {
		width: 150px;
	}
}
@media screen and (max-width: 768px) {
	.tech-grid-item-row {
		flex-flow: column;
		align-items: center;
		gap: 40px;
	}
}

/* ------------------------------------------------------------
Use case
---------------------------------------------------------------*/
.sec-usecase {
	padding: 0 30px;
	padding-top: 10px;
}

.sec-usecase .sec-col {
	gap: 80px;
}

.usecase-anc-links {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.usecase-anc-links > a {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--c-white-30);
	border-radius: 10px;
	padding: 30px;
	transition: var(--transition-base);
}
.usecase-anc-links > a:hover {
	border: 1px solid var(--c-white);
}
.usecase-anc-links > a > span {
	font-size: 18px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: 0.048em;
	text-align: center;
	white-space: nowrap;
}

.usecase-cont {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 80px;
}
.usecase-cont-group {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 20px;
}
.usecase-cont-grid-wrapper {
	width: 100%;
	position: relative;
	overflow-x: hidden;
}
.usecase-cont-grid {
	width: 100%;
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(3, 1fr);
}

@media screen and (max-width: 999px) {
	.usecase-anc-links {
		gap: 15px;
	}
	.usecase-anc-links > a {
		padding: 20px;
	}
	.usecase-anc-links > a > span {
		font-size: 16px;
	}
	.usecase-cont-grid-wrapper {
		overflow-x: auto;
		padding-bottom: 20px;
	}
	.usecase-cont-grid-2col {
		min-width: 620px;
		grid-template-columns: repeat(2, 1fr);
	}
	.usecase-cont-grid-3col {
		min-width: 940px;
	}
}

@media screen and (max-width: 768px) {
	.sec-usecase .sec-col {
		gap: 60px;
	}
	.usecase-cont {
		gap: 60px;
	}
	.usecase-anc-links {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}
	.usecase-anc-links > a > span {
		font-size: 14px;
	}
}
@media screen and (max-width: 500px) {
	.usecase-anc-links {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ------------------------------------------------------------
Contact
---------------------------------------------------------------*/
.sec-contact-form {
	padding: 0 30px;
 padding-top: 0px;
}
.sec-contact-form .awc-col {
	width: 100%;
	border-top: 1px solid var(--c-white-30);
	padding-top: 50px;
}
.form-area {
	width: 100%;
/*	height: 800px;*/
 height: fit-content;
/*	display: flex;*/
/*	justify-content: center;*/
/*	align-items: center;*/
/*	background: var(--c-white-30);*/
}
.form-area iframe{
 margin: 50px 0 0;
}
.sec-contact-form .form-area{
 padding-top: 50px;
 margin-top: 50px;
 border-top: solid 1px #ffffff4d;
}
.sec-contact-form .form-area dl{
 display: flex;
 justify-content: space-between;
}
.sec-contact-form .form-area dl:not(:first-child){
 margin-top: 30px;
}
.sec-contact-form .form-area dl dt{
 font-size: 14px;
 font-weight: bold;
 letter-spacing: 0.05rem;
 line-height: 1.92;
 padding-top: 15px;
 padding-left: 50px;
}
.sec-contact-form .form dl dd{
 width: 670px;
}
.sec-contact-form .form-area dl dd input[type="text"],
.sec-contact-form .form-area dl dd input[type="tel"],
.sec-contact-form .form-area dl dd input[type="email"],
.sec-contact-form .form-area dl dd textarea{
 width: 100%;
 max-width: 400px;
 background-color: unset;
 border: solid 1px #ffffff4d;
 border-radius: 5px;
 padding: 15px 20px;
 max-height: 50px;
 box-sizing: border-box;
 font-size: 14px;
 font-weight: 500;
 letter-spacing: 0.05rem;
 line-height: 1.92;
}
.sec-contact-form .form-area dl dd textarea{
 max-height: 150px;
 max-width: 100%;
}
.sec-contact-form .form-area label{
 font-size: 14px;
 font-weight: bold;
 line-height: 1.92;
 letter-spacing: 0.05rem;
}
.custom-checkbox {
 position: relative;
 display: inline-block;
 padding-left: 40px;
 cursor: pointer;
 user-select: none;
 line-height: 30px;
}
.custom-checkbox input[type="checkbox"] {
 position: absolute;
 opacity: 0;
 cursor: pointer;
}
.custom-checkbox::before {
 content: "";
 position: absolute;
 left: 0;
 top: 0;
 width: 30px;
 height: 30px;
 background-color: unset;
 border: solid 1px #ffffff4d;
 border-radius: 5px;
 box-sizing: border-box;
}
.custom-checkbox input[type="checkbox"]:checked + span::after {
 content: "";
 position: absolute;
 background: url('../images/common/icon-check-white.png') no-repeat center center;
 background-size: cover;
 width: 20px;
 height: 25px;
 left: 5px;
 top: 3px;
}
.custom-checkbox span a {
 pointer-events: auto;
}
.custom-checkbox span a {
 color: #fff;
 text-decoration: underline;
}
.sec-contact-form .form-submit{
 margin: 50px auto 0;
}
.sec-contact-form .form-submit button{
 display: block;
 margin: 0 auto;
 font-size: 14px;
 font-weight: bold;
 letter-spacing: 0.05rem;
 line-height: 1.92;
 border: solid 1px #ffffff4d;
 padding: 15px 61px;
 border-radius: 100px;
}
.sec-contact-form .form-submit button:hover{
 background-color: #ffffff4d;
}
@media screen and (max-width: 500px) {
 .form-area iframe{
  margin: 0;
 }
 .page-contact .sub-ttl{
  font-size: 16px;
 }
 .sec-contact-form .form-area{
  padding-top: 30px;
  margin-top: 30px;
 }
 .sec-contact-form .form-area dl{
  display: block;
 }
 .sec-contact-form .form-area dl:not(:first-child){
  margin-top: 20px;
 }
 .sec-contact-form .form-area dl dt{
  padding: 0 0 10px;
 }
 .sec-contact-form .form dl dd{
  width: 100%;
 }
 .sec-contact-form .form-area dl:nth-child(6) dd{
  text-align: center;
 }
 .sec-contact-form .form-submit{
  margin: 30px auto 0;
 }
}

/* ------------------------------------------------------------
Privacy policy
---------------------------------------------------------------*/
.sec-privacy {
	padding: 0 30px;
}
.privacy-list {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 50px;
}
.privacy-list-item {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 15px;
}
.privacy-list-item > h3 {
	width: 100%;
	font-size: 18px;
	letter-spacing: 0.048em;
	font-weight: 700;
	line-height: 1.8;
}
.pli-txt-area {
	width: 100%;
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	gap: 10px;
}
.pli-txt-area a {
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: var(--transition-base);
}
.pli-txt-area a:hover {
	color: var(--c-primary);
}