@charset "utf-8";

/* 変数 */
:root {
	--okm-red: #e60039; 

	--okm-shin-go-l: "UD Shin Go Light" , "UDShinGoPro-Light", sans-serif;
	--okm-shin-go-r: "UD Shin Go Regular" ,  "UDShinGoPro-Regular", sans-serif;
	--okm-shin-go-m: "UD Shin Go Medium" , "UDShinGoPro-Medium" , sans-serif;
	--okm-shin-go-db: "UD Shin Go DemiBold" , "UDShinGoPro-DeBold", sans-serif;
	--okm-shin-go-b: "UD Shin Go Bold" , "UDShinGoPro-Bold", sans-serif;
	--okm-shin-go-h: "UD Shin Go Heavy" , "UDShinGoPro-Heavy" , sans-serif;

	--line-gray: #bbb; 
	--gray-frame: #eee; 
	--card-outline: #999; 


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

	}

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

	}

}

/* 共通 */

.corp-inq-solid_line {
	height: 0; 
	margin: auto; 
	margin-top:clamp(80px, calc(100vw * 70 / 1200) , 70px); 
	margin-bottom:clamp(50px, calc(100vw * 100 / 1200) , 100px); 
	padding: 0; 
	border: none; 
	outline: none; 
	border-top: 1px solid var(--line-gray);
	max-width: 1200px; 
	width: min(calc(100% - 40px), 1200px); 
}

section  > .corp-inq-solid_line {
	width: 100%; 
}

a[class*="btn--"][class*="--normal"] {
	border: 1px solid var(--card-outline);
}

.corp-inq-contents-section .okm--style--h2,
.corp-inq-tel .okm--style--h2 {
	margin: 0 0 30px;
	display: block; 
	text-align: center; 
	font-size:clamp(20px, calc(100vw * 24 / 1200) , 24px); 
	line-height: 1.4; 
}

.corp-inq-contents-section .okm--style--h2 span,
.corp-inq-tel .okm--style--h2 span {
	display: block; 
	white-space: nowrap; 
	word-break: keep-all; 
}


.corp-inq-lead_text {
	display: block; 
	text-align: center; 
}

.corp-inq-lead_text p {
	margin: 0 !important; 
	padding: 0; 
	text-align: left; 
	font-size: 15px; 
}

.corp-inq-thumb-card__list,
.corp-inq-tel__list {
	list-style-type: disc; 
	padding-left: 1.25em; 
	line-height: 1.5; 
}

a[class^="okm--btn"][class*="btn--middle"][class*="--normal"] i:after, 
a[class^="okm--btn"][class*="btn--large"][class*="--normal"] i:after {
	background-image: linear-gradient(90deg, var(--okm-red), var(--okm-red) 50%, var(--okm-red) 50%, var(--okm-red));
}

/* タイトル セクション */
.corp-inq-title-section {

}

.corp-inq-title-block {
	margin-top: calc((12px + 20px + 20px) * -1); 
	background: var(--bg-light-gray); 
	padding: 0; 
	position: relative; 

	padding-top:clamp(70px, calc(100vw * 90 / 1200) , 90px); 
	padding-bottom:clamp(40px, calc(100vw * 70 / 1200) , 70px); 

}

.corp-inq-header {
	width: min(calc(100% - 40px), 1200px); 
	margin: auto;

	justify-content: space-between;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column; 
	gap: 20px; 
}

.corp-inq-header__title-group {

}


.corp-inq-header__page-title {
	font-family: var(--okm-shin-go-r);
	font-size:clamp(22px, calc(100vw * 34 / 1200) , 34px); 
    line-height: 1.05;
	letter-spacing: 0; 
    display: block;
	margin-bottom:clamp(5px, calc(100vw * 10 / 1200) , 10px); 
}


.corp-inq-header__page-subtitle {
	margin-bottom: 0;
	font-size:clamp(14px, calc(100vw * 20 / 1200) , 20px); 
	font-family: var(--okm-shin-go-r) !important;
}

.inquiry--title--btn--block_btn {

}

.corp-inq-cta {
	justify-content: center; 
	justify-content: flex-end; 

	width: fit-content;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch; 
	flex-direction: column; 
	flex-direction: column-reverse; 
	gap: 10px; 
}

.corp-inq-cta__link {
	display: block; 
	background-color: #fff; 
	margin-left: auto;
	width: fit-content; 
	font-size:clamp(12px, calc(100vw * 15 / 1200) , 15px); 
	border: 1px solid var(--card-outline);
	border-radius: 6px;
	padding: 0 1em 0 1.2em; 
	transition: all .2s ease;
}

.corp-inq-cta__link:hover {
	background-color: var(--okm-red); 
	border-color: #fff; 
}

.corp-inq-cta__link span {
	display: block; 
	padding-right: 16px; 
	position: relative; 
	transition: color .2s ease;
}

.corp-inq-cta__link:hover span {
	color: #fff; 
}

.corp-inq-cta__link span:after {
	content: ""; 
	display: block; 
	width: 6px; 
	height: 13px; 
	border: 1px solid #000;
	position: absolute; 
	right: 0px; 
	top: 50%; 
	transform: translateY(-50%);
	background-color: var(--okm-red); 

	mask-image: url("../images/corp-inq-cta__link.svg");
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: 6px 13px;

	-webkit-mask-image: url("../images/corp-inq-cta__link.svg");
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: 6px 13px;

	transition: background-color .2s ease;
}

.corp-inq-cta__link:hover span:after {
	background-color: #fff; 
}

.corp-inq-cta__note {
	word-break: keep-all; 
}

.corp-inq-nav {
	border-top: 1px solid var(--line-gray);
	border-bottom: 1px solid var(--line-gray);
}

.corp-inq-nav__list {
	width: min(100% , 1200px); 
	margin: auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr); 
}

.corp-inq-nav__item {
	text-align: left; 
	font-size:clamp(12px, calc(100vw * 15 / 1200) , 15px); 
	height: 4.6em; 
	line-height: 1.6; 
}

.corp-inq-nav__link {
	display: block; 
	width: 100%; 
	height: inherit; 
	display: grid;
	align-items: center;
	position: relative; 
	transition: background .7s ease;
	padding: 0 15px; 
}

.corp-inq-nav__link:hover {
	background: #f5f5f5; 
}


.corp-inq-nav__item:nth-child(even) .corp-inq-nav__link:before{
	content: ""; 
	position: absolute; 
	left: -0.5px; 
	height: calc(100% - 20px); 
	width: 1px; 
	background: var(--line-gray); 
	top: 10px; 
}

.corp-inq-nav__item:nth-child(-n + 2) .corp-inq-nav__link:after {
	content: ""; 
	position: absolute; 
	left: 10px; 
	bottom: -0.5px; 
	width: calc(100% - 20px); 
	height: 1px; 
	background: var(--line-gray); 
}

.corp-inq-nav__link span {
	width: fit-content; 
	display: block; 
	position: relative; 
	padding-left: 26px; 
	word-break: keep-all; 
	text-align: left; 
}

.corp-inq-nav__link span:before {
	content: ""; 
	display: block; 
	position: absolute; 
	left: 0px; 
	top: 0.6em; 
	width: 14px; 
	height: 8px; 
	background: var(--okm-red); 

	mask-image: url("../images/nav__link.svg");
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: 14px 8px;

	-webkit-mask-image: url("../images/nav__link.svg");
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: 14px 8px;

}



/* コンテンツ セクション */

.corp-inq-contents-section {
	margin: auto;
	margin-top:clamp(60px, calc(100vw * 100 / 1200) , 100px); 
	margin-bottom:clamp(80px, calc(100vw * 120 / 1200) , 120px); 
	width: min(calc(100% - 40px), 1200px); 
}


/* お知らせ */ 

.corp-inq-info {
	margin: 30px auto 0;
	width: min(calc(100% - 40px), 1200px); 
	border: 1px solid #f0d1d9;
	background-color: #fef2f5; 

	padding-top:clamp(10px, calc(100vw * 20 / 1200) , 20px); 
	padding-bottom:clamp(10px, calc(100vw * 20 / 1200) , 20px); 
	padding-right:clamp(20px, calc(100vw * 40 / 1200) , 40px); 
	padding-left:clamp(20px, calc(100vw * 40 / 1200) , 40px); 

	display: grid; 

	grid-template-areas:
		"title"
		"contents";

	gap: 10px 0; 
}

.corp-inq-info__title {
	grid-area: title; 
	color: var(--okm-red); 
	font-size:16px; 
	font-family: var(--okm-shin-go-m);
}

.corp-inq-info__body {
	grid-area: contents; 
}

.corp-inq-info__item {
	border-bottom: 1px dotted var(--line-gray);
	padding-bottom: 15px; 
	margin-bottom: 15px;
}

.corp-inq-info__item:last-child {
	border-bottom: none;
	padding-bottom: 0; 
	margin-bottom: 0;
}

.corp-inq-info__term {
	font-family: var(--okm-shin-go-m);
	cursor: pointer; 
	outline: none; 
}

.corp-inq-info__term-title {
	padding-right: 30px; 
	position: relative; 
}

.corp-inq-info__term-title i {
	content: ""; 
	display: block; 
	width: 20px; 
	height: 20px; 
	border-radius: 50%;
	background: #fff; 
	position: absolute; 
	right: 0; 
	top: 0.275em; 
}

.corp-inq-info__term-title i:before,
.corp-inq-info__term-title i:after {
	content: ""; 
	width: 12px; 
	height: 1px; 
	background: #333; 
	position: absolute; 
	top: 50%; 
	left: 50%; 
	transform-origin: center; 
	transition: transform .2s ease;
}

.corp-inq-info__term-title i:before {
	transform: translate(-50%, -50%);
}

.corp-inq-info__term-title i:after,
.close .corp-inq-info__term-title i:after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.open .corp-inq-info__term-title i:after {
	transform: translate(-50%, -50%) rotate(0);
}

.corp-inq-info__desc {
	padding-top: 20px; 
	display: none;
}

.corp-inq-info__desc .corp-inq-info__subtitle {
	display: block; 
	margin: 0 0 0.5em;
}

.corp-inq-info__desc p {
	margin: 0 0 1em !important;
}

.corp-inq-info__desc table {
	width: 100%; 
}

.corp-inq-info__desc table,
.corp-inq-info__desc tr,
.corp-inq-info__desc th,
.corp-inq-info__desc td {
	border: 1px solid #000;
}

.corp-inq-info__desc th,
.corp-inq-info__desc td {
	padding: 0.5em; 
}

/* よくあるご質問（FAQ） */
.corp-inq-contents-faq__shortcut {
	max-width: min(calc(100% - 40px), 860px); 
	width: fit-content; 
	margin: auto;

	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	flex-direction: column; 
	gap: 5px; 
}


.corp-inq-contents-faq__shortcut__item {

}

.corp-inq-contents-faq__shortcut__link {
	display: block; 
	text-align: left; 
	font-size:15px; 
	color: #333; 
	transition: color .2s ease;
}

.corp-inq-contents-faq__shortcut__link:hover {
	color: var(--okm-red); 
}

.corp-inq-contents-faq__shortcut__link span {
	display: block; 
	width: fit-content; 
	position: relative; 
	padding: 0 0 0 24px; 
}

.corp-inq-contents-faq__shortcut__link span:before {
	content: ""; 
	display: block; 
	position: absolute; 
	width: 17px; 
	height: 17px; 
	left: 0px; 
	top: 50%; 
	transform: translateY(calc(-50% - 2.5px)); 
	background-color: var(--okm-red); 

	mask-image: url("../images/faq__shortcut__link.svg");
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: 17px 17px;

	-webkit-mask-image: url("../images/faq__shortcut__link.svg");
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: 17px 17px;
}

.corp-inq-contents-faq__shortcut__link span:after {
	content: ""; 
	display: block; 
	position: absolute; 
	left: 0px; 
	bottom: 0px; 
	height: 1px; 
	background: var(--okm-red); 
	width: 100%; 
	transform-origin: right;
	transform: scaleX(0);
	transition: transform .5s ease, opacity .5s ease;

}

.corp-inq-contents-faq__shortcut__link:hover span:after {
	transform: scaleX(1);
	transform-origin: left;
}


.corp-inq-contents-faq_link {
	max-width: 900px; 
	margin: 20px auto;
}

.corp-inq-contents-faq_link a[class^="okm--btn"] {
	flex-wrap: nowrap;
	gap: 20px; 
}

.corp-inq-contents-faq_link a div {
	width: calc(100% - 60px); 
}

.corp-inq-contents-faq_link a[class^="okm--btn"][class*="btn--middle"], 
.corp-inq-contents-faq_link a[class^="okm--btn"][class*="btn--large"] {
	padding: 15px; 
}


.corp-inq-contents-faq_link .okm--style--h3 {
	margin: 0 0 5px;
	font-family: var(--okm-shin-go-m); 
	font-size:clamp(16px, calc(100vw * 18 / 1200) , 18px); 

}

.corp-inq-contents-faq_link span {
	font-size:clamp(12px, calc(100vw * 14 / 1200) , 14px); 
}

a[class^="okm--btn"][class*="btn--middle"] span, 
a[class^="okm--btn"][class*="btn--large"] span {
	max-width: 100%; 
}

/* 製品やサービスに関するお問い合わせ・ご相談 */
/* アフターサポート（サポートサイト） */

.corp-inq-thumb-grid,
.corp-support-thumb-grid {
	display: grid; 
	gap:clamp(12px, calc(100vw * 60 / 1200) , 60px); 
	margin-top:clamp(30px, calc(100vw * 50 / 1200) , 50px); 
}

.corp-inq-thumb-grid {
	grid-template-columns: repeat(2, 1fr); 
}

.corp-support-thumb-grid {
	grid-template-columns: repeat(1, 1fr); 
}

.corp-inq-thumb-card,
.corp-support-thumb-card {
	border: 1px solid var(--card-outline);
	background: #fff; 
}

.corp-inq-thumb-card__content {
	padding:clamp(10px, calc(100vw * 30 / 1200) , 30px); 
	line-height: 1.5; 
}

.corp-inq-thumb-card__image {
	aspect-ratio: 480 / 340;
	background: rgba(0,0,0,0.5); 
}

.corp-inq-thumb-card__image img {
	width: 100% !important; 
	height: 100% !important; 
	object-fit: cover; 
}

.corp-inq-thumb-card__title {
	font-family: var(--okm-shin-go-m); 
	font-size:clamp(12px, calc(100vw * 18 / 1200) , 18px); 
	margin-bottom: 10px;
}

.corp-inq-thumb-card__list {
	font-size:clamp(12px, calc(100vw * 15 / 1200) , 15px); 
}

.corp-inq-thumb-card__item {
	margin-bottom: 5px;
}

.corp-inq-thumb-card__item:last-child {
	margin-bottom: 0;
}

.corp-inq-thumb-card__text {
	font-size:clamp(12px, calc(100vw * 15 / 1200) , 15px); 
	line-height: 1.8; 
}

.corp-support-thumb-card__content {
	padding:clamp(18px, calc(100vw * 30 / 1200) , 30px)  clamp(25px, calc(100vw * 30 / 1200) , 30px); 



	display: grid; 

	grid-template-areas:
		"icon title"
		"text text";
	grid-template-columns: 77px 1fr;
	gap: 10px 0; 
}

.corp-support-thumb-card__content > * {

}

.corp-support-thumb-card__icon {
	grid-area: icon; 
	width: 77px; 
	height: auto; 
	aspect-ratio: 1;
}

.corp-support-thumb-card__title {
	grid-area: title; 
	align-self: center; 
}

.corp-support-thumb-card__title span {
	font-size: 16px; 
	font-family: var(--okm-shin-go-m); 
	display: block; 
}

.corp-support-thumb-card__text {
	font-size:clamp(15px, calc(100vw * 16 / 1200) , 16px); 
	grid-area: text; 
}


.corp-support-btns-grid {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch; 
	flex-direction: column; 
	gap: 20px; 
	margin-top: 20px;
}

.corp-support-btns-grid .okm--btn--large--normal {
	margin: 0 !important;
	border: 1px solid var(--card-outline);
}

.corp-support-btns-grid a[class^="okm--btn"][class*="btn--large"] {
	padding: 15px 13px; 
	min-height: auto; 
}


.corp-form-btns-grid {
	width: 100%;
	max-width: 590px; 
	margin: auto;
}


/* お電話でのお問い合わせ・ご相談（お客様窓口） */
.corp-inq-tel {
	width: min(calc(100% - 40px), 1000px); 
	margin: auto;
	margin-bottom:clamp(80px, calc(100vw * 120 / 1200) , 120px); 
}

.corp-inq-tel__notice,
.corp-inq-tel__info {
	background: var(--gray-frame); 
	padding:clamp(20px, calc(100vw * 30 / 1200) , 30px); 
}

.corp-inq-tel__notice {
	margin-bottom:clamp(20px, calc(100vw * 30 / 1200) , 30px); 
}

.corp-inq-tel__notice .okm--style--h3,
.corp-inq-tel__info .okm--style--h3 {
	font-family: var(--okm-shin-go-m); 
	margin: 0 0 15px;
	font-size:clamp(16px, calc(100vw * 18 / 1200) , 18px); 
}

.corp-inq-tel__list {
	font-size: 15px; 
}

.corp-inq-tel__list li {
	margin-bottom: 10px; 
}

.corp-inq-tel__list li:last-child {
	margin-bottom: 0;
}

.corp-inq-tel__contacts {
	margin: 20px 0 0;

	display: flex;
	flex-wrap: wrap;
	align-items: stretch; 
	flex-direction: column; 
	gap: 10px; 
}

.corp-inq-tel__contact {
	display: block; 
	padding: 10px; 
	width: fit-content; 
	background: #fff; 
	font-size: 24px; 
}

/* ==================================================
= Media Queries
================================================== */

/* 480px未満 */
@media only screen and (max-width: 479px) {


}

/* 480px以上 */
/* スマホ */
@media only screen and (min-width: 480px) {


}

/* 568px以上 */
/* タブレット */
@media only screen and (min-width: 568px) {


}

/* 667px以上 */
/* タブレット */
@media only screen and (min-width: 667px) {


}

/* 768px以上 */
/* タブレット */
@media only screen and (min-width: 768px) {



}

/* 1024px以上 */
/* PC */
@media only screen and (min-width: 1024px) {


	/* 共通 */

	.corp-inq-lead_text p {
		text-align: center; 
	}

	.corp-inq-contents-section .okm--style--h2 span,
	.corp-inq-tel .okm--style--h2 span {
		display: inline-block; 
	}

	.corp-inq-thumb-card__list,
	.corp-inq-tel__list {
		line-height: 1.8; 
	}

	/* タイトル セクション */
	.corp-inq-header {
		flex-wrap: nowrap;
		flex-direction: row; 
	}

	.corp-inq-header__page-title {
		letter-spacing: 0.08em; 
	}

	.corp-inq-cta {
		justify-content: center; 
		width: fit-content;
		flex-direction: column; 
		gap: 15px; 
	}

	.corp-inq-cta__link {
		margin: auto;
	} 


	.corp-inq-nav__list {
		grid-template-columns: repeat(4, 1fr); 
	}

	.corp-inq-nav__item {
		text-align: center; 
	}

	.corp-inq-nav__link {
		justify-items: center;
	}


	.corp-inq-nav__link span:before {
		top: 50%; 
		transform: translateY(-50%);
	}


	.corp-inq-nav__item:nth-child(even) .corp-inq-nav__link:before, 
	.corp-inq-nav__item .corp-inq-nav__link:before{
		content: ""; 
		position: absolute; 
		left: -0.5px; 
		height: 30px; 
		width: 1px; 
		background: var(--line-gray); 
		top: 10px; 
		top: calc((100% - 30px) / 2); 
	}

	.corp-inq-nav__item:nth-of-type(1) .corp-inq-nav__link:before{
		display: none; 
	}

	.corp-inq-nav__item:nth-child(-n + 2) .corp-inq-nav__link:after {
		display: none; 
	}


	/* お知らせ */ 
	.corp-inq-info {
		grid-template-areas:
			"title contents";
		grid-template-columns: calc(4em + 40px) 1fr;
		gap: 40px; 
		align-items: start;
	}

	.corp-inq-info__title {
		border-right: 1px solid var(--line-gray);
	}


	/* よくあるご質問（FAQ） */
	.corp-inq-contents-faq__shortcut {
		flex-direction: row; 
		gap: 40px; 
	}

	.corp-inq-contents-faq__shortcut__link span {
		padding: 0 0 5px 24px; 
	}

	.corp-inq-contents-faq_link a div {
		width: calc(100% - 80px); 
	}

	.corp-inq-contents-faq_link a[class^="okm--btn"][class*="btn--middle"], 
	.corp-inq-contents-faq_link a[class^="okm--btn"][class*="btn--large"] {
		padding: 15px 30px; 
	}




	/* 製品やサービスに関するお問い合わせ・ご相談 */
	/* アフターサポート（サポートサイト） */
	.corp-inq-thumb-grid,
	.corp-support-thumb-grid {
		grid-template-columns: repeat(3, 1fr); 
	}


	.corp-support-thumb-card__content {
		grid-template-areas:
			"icon"
			"title"
			"text";
		grid-template-columns: 1fr;
		grid-template-raws: 120px auto auto
		gap: 0; 

	}


	.corp-support-thumb-card__icon {
		grid-area: icon; 
		width: 120px; 
		margin: 0 auto 7px;
	}

	.corp-support-thumb-card__title {
		text-align: center; 
	}

	.corp-support-btns-grid {
		flex-wrap: nowrap;
		align-items: center; 
		flex-direction: row; 
		gap: 25px; 
		margin-top: 40px;
	}

	.corp-support-btns-grid a[class^="okm--btn"][class*="btn--large"] {
		padding: 20px 25px; 
	}

	/* お電話でのお問い合わせ・ご相談（お客様窓口） */
	.corp-inq-tel__contacts {
		flex-direction: row; 
		gap: 20px; 
	}

	.corp-inq-tel__list li {
		margin-bottom: 5px; 
	}

}