@charset "UTF-8";

/* ====================================
	グローバル：リセットスタイル
 ==================================== */
:root {
	scroll-behavior: auto;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure {
	margin: 0;
	line-height: inherit;
}

img,
video {
	inline-size: 100%;
	block-size: auto;
	vertical-align: middle;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

em {
	font-style: normal;
	font-weight: bold;
}

hr {
	margin: 0;
	opacity: 1;
	border: none;
	border-top: solid 1px #bfbfbf;
}

button {
	appearance: none;
	background: transparent;
	border: none;
	border-radius: 0;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
	color: #000;
}

:focus {
	outline: none;
}

/* ====================================
	グローバル：ベーススタイル
 ==================================== */
:root {
	--sharp-red: #e6000d;
	--cyan: #116aff;
	--charcoal-gray: #535353;
	--steel-gray: #767676;
	--silver-gray: #a0a0a0;
	--light-gray: #d9d9d9;
	--white-gray: #f5f5f5;
	--border-radius-small: 10px;
	--border-radius-medium: 20px;
	--border-radius-large: 30px;
}

html {
	font-size: 62.5%;
}

body {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.6rem;
	line-height: 1.6;
	font-weight: 300;
	color: #000;
}

a {
	color: #000;
	text-decoration: none;
}

/* フォーカスインジケータ― */
*:focus-visible {
	outline: 2px solid var(--cyan);
	outline-offset: 1px;
}

/* ==========================================
	ホバー、マウスポインタがサポートされている環境
=========================================== */
@media (hover:hover) and (pointer: fine) {

	a:hover {
		color: #000;
		text-decoration: underline;
		text-underline-offset: 2px;
	}

	.hover-fade a,
	a.hover-fade,
	a.hover-parent.hovering .hover-trigger.fade {
		transition: opacity .3s ease 0s;
	}

	.hover-fade a.hovering,
	a.hover-fade.hovering,
	a.hover-parent.hovering .hover-trigger.fade {
		opacity: .7;
	}

	a.hover-parent {
		display: block;
		pointer-events: none;
		text-decoration: none;
	}

	a.hover-parent .hover-trigger {
		pointer-events: auto;
	}

	a.hover-parent span.hover-trigger {
		display: inline-block;
	}

	a.hover-parent.hovering .hover-trigger {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	/* ブロックスキップリンク	 */
	#blockSkip a:hover {
		text-decoration: none;
	}

	/* ページトップに戻る */
	.link-page-top:hover {
		background-image: url('/assets/common/images/chevron-up-solid.svg');
		background-color: #fff;
		transition: background-color .3s ease;
	}

	/* もとのページに戻る */
	.link-page-back:hover {
		text-decoration: none;
		background-color: #fff;
		transition: background-color .3s ease;
	}

	.link-page-back:hover::before {
		background-image: url('/assets/common/images/arrow-back-b.svg');
	}

	/* ボタンリンク */
	.btn-has-arrow-left:hover {
		color: #fff;
		background-color: #000;
		text-decoration: none;
		transition: background-color .3s ease;
	}
}

/* ====================================
	共通スタイル
===================================== */

/* パンくずリスト */
#breadcrumb {
	background: #e6e6e6;
}

.breadcrumb-page-title {
	display: inline;
	font-size: inherit;
	font-weight: inherit;
}

.list-breadcrumb {
	font-size: 1.2rem;
	font-weight: 400;
	padding-block: .5em;
}

.list-breadcrumb>li {
	display: inline;
}

.list-breadcrumb>li:not(:first-child)::before {
	content: '\03e';
	margin-inline: .5em;
}

/* グローバルフッター */
#globalFooter {
	background: #403d33;
}

#globalFooter a {
	color: #fff;
}

.global-footer-container {
	border-bottom: solid 1px #535148;
}

#globalFooterNavi a,
#copyright a {
	color: #c3c2bb;
}

/* 注釈マーク */
.ast li::before,
.kome li::before,
.star li span {
	color: var(--cyan);
}

/* スクロール禁止指定 */
.scroll-prevent {
	position: fixed;
	inline-size: 100%;
	block-size: 100%;
	overflow-y: scroll;
}

/* ブロックスキップリンク */
#blockSkip {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	left: -100%;
	top: -100%;
	z-index: -1;
}

#blockSkip:focus-within {
	position: absolute;
	inline-size: fit-content;
	block-size: fit-content;
	left: 20px;
	top: 20px;
	z-index: 10;
}

#blockSkip a:focus-visible {
	font-weight: 400;
	padding: .4em;
	background-color: #fff;
}

/* グローバルヘッダー・ラップ要素 */
.global-header-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	block-size: 5.6rem;
}

/* グローバルヘッダー・サイトロゴ */
.global-header-logo {
	inline-size: max(96px, 9.6rem);
}

/* グローバルヘッダー・サイト内検索アイコン */
.btn-global-header-search {
	inline-size: 3rem;
}

/* グローバルヘッダー：検索フォーム */
.global-form-search {
	display: block;
	inline-size: calc(100% - 4rem);
	block-size: 4rem;
	background-color: #fff;
	border: none;
	padding: 0.4em 0 0.4em 1em;
	font-size: 1.6rem;
	line-height: 1;
}

.global-form-submit {
	display: block;
	inline-size: 4rem;
	border-radius: 0;
	background-color: #000;
}

.global-form-submit img {
	inline-size: 2.4rem;
}

/* グローバルページタイトル */
#globalPageTitle {
	margin-bottom: 2.5em;
	border-bottom: 1px solid var(--light-gray);
}

.global-page-title {
	inline-size: 100%;
	font-size: 2rem;
	font-weight: 500;
	text-align: center;
	padding-block: .3em;
}

/* 2024年以降ver・ページタイトル */
.global-title {
	font-size: 2.6rem;
	font-weight: 700;
	text-align: center;
	margin-block: 2em 1.5em;
}

/* ページトップに戻るボタン */
#pageTop {
	padding-block: 2rem;
	text-align: right;
	position: sticky;
	bottom: 0;
	z-index: 10;
	font-size: 0;
	pointer-events: none;
}

.link-page-top {
	display: inline-block;
	inline-size: 4rem;
	block-size: 3rem;
	border-radius: 5px;
	border: 1px solid var(--charcoal-gray);
	background: var(--charcoal-gray) url('/assets/common/images/chevron-up-solid-w.svg') no-repeat center center/18px auto;
	pointer-events: auto;
}

/* もとのページに戻るボタン */
#pageTop .has-page-back {
	display: flex;
	column-gap: 1.6rem;
	justify-content: end;
}

.link-page-back {
	display: grid;
	align-items: center;
	grid-template-columns: 1fr auto;
	column-gap: 1rem;
	font-size: 1.4rem;
	font-weight: 500;
	color: #fff;
	inline-size: fit-content;
	block-size: 3rem;
	padding-inline: 0.8em;
	border-radius: 5px;
	border: 1px solid var(--charcoal-gray);
	background: var(--charcoal-gray);
	pointer-events: auto;
}

.link-page-back::before {
	content: '';
	align-self: center;
	display: inline-block;
	inline-size: 1.3rem;
	block-size: 1.1rem;
	background: url('/assets/common/images/arrow-back-w.svg') no-repeat center center/contain;
}

#copyright {
	color: #fff;
	text-align: center;
}

/* 注釈 */
.caption {
	font-size: 1.2rem;
}

.caption>li>span {
	color: var(--cyan);
	margin-right: .5em;
}

/* 注釈・その他共通 */
:is(.caption.disc, .caption.ast, .caption.dia, .caption.kome, .caption.hoshi, .caption.normal)>li::before {
	margin-right: 0.5em;
}

/* 注釈・「・」 */
.caption.normal>li::before {
	content: "\30fb";
}

/* 注釈・「●」 */
.caption.disc>li::before {
	content: "\25cf";
}

/* 注釈・「◆」*/
.caption.dia>li::before {
	content: "\25c6";
}

/* 注釈・「＊」*/
.caption.ast>li::before {
	content: "\ff0a";
}

/* 注釈・「★」*/
.caption.hoshi>li::before {
	content: "\2605";
}

/* 注釈・「※」 */
.caption.kome>li::before {
	content: "\203b";
}

/* ====================================
	スマートフォン専用スタイル（～768px）
===================================== */
@media screen and (width <768px) {

	.desktop-only,
	.pc-only {
		display: none;
	}

	.base-width-sp,
	.base-width {
		padding-inline: 5%;
	}

	.star>li>span,
	.single>li>span {
		margin-right: .5em;
	}

	/* 注釈（※） */
	.kome>li::before {
		content: "\203b";
		margin-right: 0.5em;
	}

	/* グローバヘッダー */
	.global-header-container {
		block-size: 56px;
		padding-top: 14px;
		padding-bottom: 9px;
		position: relative;
	}

	.btn-global-header-menu-open,
	.btn-global-header-menu-close {
		position: absolute;
		top: 16px;
		left: 5%;
		inline-size: 24px;
	}

	.btn-global-header-menu-close {
		display: none;
	}

	/* グローバヘッダー：グローバルナビゲーション */
	.global-header-navi {
		display: none;
		position: fixed;
		inline-size: 100%;
		block-size: 100%;
		background-color: rgba(0, 0, 0, 0.6);
		overflow: auto;
		top: 56px;
		left: 0;
		z-index: 100;
	}

	.list-header-navi li,
	.list-header-sub-navi li {
		background-color: #fff;
	}

	ul.list-global-header-navi,
	ul.list-global-header-sub-navi,
	.global-header-navi-footer {
		inline-size: 100%;
		background: #fff;
		position: relative;
	}

	.list-global-header-navi>li,
	.list-global-header-sub-navi>li {
		border-top: var(--light-gray) 1px solid;
	}

	.list-global-header-navi>li>a,
	.list-global-header-sub-navi>li>a {
		display: block;
		padding: 16px 40px 16px 20px;
		font-size: 1.4rem;
		font-weight: 500;
		position: relative;
	}

	.list-global-header-navi>li>a::before,
	.list-global-header-sub-navi>li>a::before {
		content: '';
		display: inline-block;
		inline-size: 12px;
		block-size: 14px;
		background: url(/assets/common/images/chevron-right-solid.svg) no-repeat center center/auto 100%;
		position: absolute;
		top: 50%;
		right: 20px;
		margin-top: -0.5em;
	}

	.list-global-header-navi>li>a[data-acod-target]::before {
		background: url(/assets/common/images/plus-solid.svg) no-repeat center center/auto 100%;
	}

	.list-global-header-navi>li>a.is-open[data-acod-target]::before {
		background: url(/assets/common/images/minus-solid.svg) no-repeat center center/auto 100%;
	}

	.global-header-navi-accordion {
		padding-inline: 20px;
		background: var(--white-gray);
		border-top: solid 1px var(--light-gray);
		display: none;
	}

	.global-header-navi-accordion a {
		display: block;
		padding-inline: 16px;
		font-size: 1.2rem;
		font-weight: 500;
	}

	.list-global-header-navi-accordion>li>a {
		padding-block: 1em;
	}

	.list-global-header-navi-accordion>li:not(:last-of-type)>a {
		border-bottom: solid 1px var(--light-gray);
	}

	.global-header-navi-footer {
		padding-block: 2rem;
		border-top: var(--light-gray) 1px solid;
	}

	/* グローバルヘッダー：検索フォーム */
	.global-header-search {
		display: none;
	}

	.global-search-form {
		inline-size: 100%;
		padding-block: 15px;
		padding-inline: 5%;
		background-color: var(--white-gray);
	}

	.global-search-form:focus {
		outline: none;
	}

	.global-form-window {
		display: flex;
		margin-left: auto;
		background: #fff;
		color: #716f63;
		border-radius: 5px;
		justify-content: space-between;
	}

	.global-search-form div.poplink.spia {
		top: 53px;
		padding-inline: 5%;
	}

	/* グローバルナビ・ソーシャルメディア */
	.list-global-navi-social {
		display: flex;
		justify-content: center;
		align-items: center;
		column-gap: 2rem;
		margin-inline: auto;
	}

	.list-global-navi-social>li {
		inline-size: 30px;
	}

	/* グローバルヘッダー：検索フォーム・カスタムエレメント */
	.mf_finder_header .mf_finder_searchBox {
		margin-left: 0;
		margin-right: 0;
	}

	.mf_finder_header .mf_finder_searchBox_items_wrapper {
		inline-size: 100%;
	}

	.mf_finder_header .mf_finder_searchBox_items {
		display: flex;
		justify-content: space-between;
		padding: 0;
	}

	.mf_finder_header .mf_finder_searchBox_query_wrap {
		display: block;
		inline-size: calc(100% - 60px);
	}

	.mf_finder_header .mf_finder_searchBox_query_input {
		min-block-size: 30px;
		background: #fff;
		border: none;
		padding: 10px 0 10px 10px;
		font-size: 1.4rem;
	}

	.mf_finder_header .mf_finder_searchBox_query_input::-webkit-input-placeholder {
		padding-top: 0.25em;
	}

	.mf_finder_header .mf_finder_searchBox_submit {
		display: block;
		inline-size: 40px;
		block-size: 40px;
		background: url('/assets/common/images/icon-search-w.svg') no-repeat center center/24px auto #000;
		border: none;
		border-radius: 0;
	}

	.mf_finder_header .mf_finder_searchBox_submit:before {
		content: '';
	}

	.mf_finder_header .mf_finder_searchBox_submit span {
		display: none;
	}

	/* グローバルヘッダー：検索アイコン */
	.global-header-icons-search {
		display: none;
	}

	/* グローバルヘッダー：検索フォーム */
	#globalSearchBar {
		display: none;
	}

	/* グローバル製品フッター */
	#globalProductsFooter {
		display: none;
	}

	/* グローバルフッター */
	#globalFooter {
		padding-bottom: 14px;
		font-size: 1.1rem;
		line-height: 1.2;
	}

	.global-footer-container {
		margin-bottom: 1em;
		padding-top: 16px;
		padding-bottom: 0.5em;
	}

	#globalFooterNavi ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

	#globalFooterNavi ul li {
		margin-bottom: 0.5em;
		padding: 0 0.5em;
		border-right: solid 1px #c3c2bb;
	}

	#globalFooterNavi ul li:last-child {
		border-right: none;
	}

}

/* ====================================
	TAB、PC、印刷専用スタイル（768px～）
===================================== */
@media print,
screen and (width >=768px) {
	.sp-only {
		display: none;
	}

	body {
		line-height: 1.5;
	}

	.outer-base-width {
		padding-inline: 1.5%;
	}

	/* 注釈 */
	.caption {
		padding-left: 2em;
	}

	.caption>li {
		text-indent: -2em;
	}

	/* 注釈・その他 */
	.caption.disc,
	.caption.ast,
	.caption.dia,
	.caption.hoshi,
	.caption.kome,
	.caption.normal {
		padding-left: 1.5em;
	}

	:is(.caption.disc, .caption.ast, .caption.dia, .caption.kome, .caption.hoshi, .caption.normal)>li {
		text-indent: -1.5em;
	}

	/* グローバルヘッダー */
	#globalHeader {
		font-size: 1.5rem;
	}

	.global-header-wrapper {
		display: flex;
		justify-content: space-between;
		column-gap: 2rem;
		block-size: unset;
	}

	/* グローバルヘッダー・サイトロゴ */
	.global-header-logo {
		inline-size: max(125px, 12.5rem);
	}

	/* スマホ表示用・グローバルナビメニュー開閉ボタン */
	.btn-global-header-menu-open,
	.btn-global-header-menu-close {
		display: none;
	}

	/* スマホ表示用・グローバルナビメニュー個人のお客様 */
	.global-header-navi-accordion {
		display: none;
	}

	/* グローバルナビゲーション */
	.global-header-navi {
		display: flex;
		align-items: center;
		justify-content: end;
		column-gap: 2rem;
		font-size: 1.5rem;
		font-weight: 400;
		min-block-size: 72px;
		padding-block: 0.5em;
	}

	.global-header-navi-wrapper {
		display: contents
	}

	.list-global-header-navi {
		display: contents;
	}

	.list-global-header-sub-navi {
		display: contents;
		font-size: .8em;
	}

	.list-global-header-sub-navi li:first-of-type a {
		border-left: 1px solid #000;
		padding-left: 1.4em;
	}

	/* スマホ表示用・ソーシャルメディアリンク */
	.list-global-navi-social {
		display: none;
	}

	/* サイト内検索フォーム */
	.global-header-search {
		display: contents;
	}

	.global-search-form-wrapper {
		display: none;
		position: fixed;
		inline-size: 100%;
		block-size: 100%;
		background-color: rgba(0, 0, 0, 0.6);
		top: 7.2rem;
		left: 0;
		z-index: 10;
	}

	.global-search-form {
		inline-size: 350px;
		margin-inline-start: auto;
	}

	.global-search-form form,
	.global-form-window {
		display: flex;
		justify-content: space-between;
	}

	/* グローバルページタイトル */
	#globalPageTitle {
		margin-bottom: 0;
		border-bottom: none;
	}

	.global-page-title {
		font-size: 3rem;
		padding-block: 1.3em;
	}

	/* 2024年以降ver・ページタイトル */
	.global-title {
		font-size: 4rem;
	}

	/* グローバルヘッダー：検索フォーム・カスタムエレメント */
	.global-form-search {
		inline-size: 300px;
		min-block-size: 50px;
	}

	.global-form-submit {
		inline-size: 50px;
	}

	.global-form-submit img {
		inline-size: 28px;
	}

	div.poplink.pcia {
		top: 50px;
	}

	/* グローバルヘッダー：旧検索フォーム・カスタムエレメント */
	.mf_finder_header .mf_finder_searchBox {
		margin-left: 0;
		margin-right: 0;
	}

	.mf_finder_header .mf_finder_searchBox_items {
		display: flex;
		justify-content: space-between;
		padding: 0;
	}

	.mf_finder_header .mf_finder_searchBox_query_input {
		display: block;
		inline-size: 300px;
		block-size: 50px;
		background-color: #fff;
		border: none;
		padding: 6px 0 6px 20px;
		font-size: 1.6rem;
		line-height: 1;
	}

	.mf_finder_header .mf_finder_searchBox_submit {
		display: block;
		inline-size: 50px;
		border-radius: 0;
		background: url('/assets/common/images/icon-search-w.svg') no-repeat center center/20px auto #000;
	}

	.mf_finder_header .mf_finder_searchBox_submit:before {
		content: '';
	}

	.mf_finder_header .mf_finder_searchBox_submit span {
		display: none;
	}

	/* パンくずリスト */
	.list-breadcrumb>li::before {
		margin-inline: 0.8em;
	}

	/* グローバルフッター共通 */
	#globalFooter {
		padding-bottom: 15px;
		font-size: 1.2rem;
		line-height: 1.2;
	}

	/* グローバルフッター・動線エリア */
	#globalProductsFooter {
		padding-block: 2.5rem;
		background: #59574c;
		color: #fff;
	}

	.global-products-footer-navi {
		display: grid;
		grid-template-columns: 2fr 1fr 2fr;
		row-gap: 2rem;
		column-gap: 2%;
		grid-template-areas:
			"prod support other"
			"prod support social";
	}

	/* 製品・サービスリンク */
	.footer-navi-prod {
		grid-area: prod;
	}

	.list-footer-navi-prod {
		display: grid;
		grid-auto-flow: column;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(7, auto);
		column-gap: .5em;
		row-gap: .5em;
	}

	/* サポート・お問い合わせリンク */
	.footer-navi-support {
		grid-area: support;
	}

	.list-footer-navi-support {
		display: flex;
		flex-direction: column;
		row-gap: .5em;
	}

	/* その他サイトリンク */
	.footer-navi-others {
		grid-area: other;
	}

	.list-footer-navi-others {
		display: flex;
		flex-wrap: wrap;
		column-gap: 4%;
		row-gap: 1em;
		font-size: 1.4rem;
	}

	.list-footer-navi-others>li {
		inline-size: 48%;
	}

	/* ソーシャルメディアアカウントリンク */
	.footer-navi-social {
		grid-area: social;
	}

	.list-footer-navi-social {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 2rem;
	}

	.list-footer-navi-social>li {
		inline-size: 30px;
	}

	/* リンク見出し */
	.footer-navi-category {
		font-size: 1.6rem;
		margin-bottom: 1em;
	}

	.footer-navi-category a,
	.list-footer-navi-prod a,
	.list-footer-navi-support a,
	.list-footer-navi-others a {
		display: inline-block;
		padding-left: 1.2em;
		position: relative;
	}

	.list-footer-navi-prod a,
	.list-footer-navi-support a {
		font-weight: 100;
	}

	.footer-navi-category a::before,
	.list-footer-navi-prod a::before,
	.list-footer-navi-support a::before,
	.list-footer-navi-others a::before {
		content: '';
		position: absolute;
		left: 0;
		background: url(/assets/common/images/chevron-right-solid-w.svg) no-repeat center center /contain;
	}

	.footer-navi-category a::before,
	.list-footer-navi-prod a::before,
	.list-footer-navi-support a::before,
	.list-footer-navi-others a::before {
		inline-size: 1em;
		block-size: 1em;
		top: .15em;
	}

	/* スマホ専用ナビを非表示 */
	.global-header-navi-footer {
		display: none;
	}

	/* グローバルフッター・会社情報以下 */
	.global-footer-container {
		margin-bottom: 15px;
		padding-block: 15px 10px;
	}

	#globalFooterNavi ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

	#globalFooterNavi ul li {
		margin-bottom: 5px;
		padding-inline: .5em;
		border-left: solid 1px #c3c2bb;
	}

	#globalFooterNavi ul li:first-child {
		border-left: none;
	}

	/* ページトップに戻る */
	#pageTop {
		block-size: 8rem;
	}

	.link-page-top {
		inline-size: 6rem;
		block-size: 4rem;
	}

	/* もとのページに戻るボタン */
	#pageTop .has-page-back {
		column-gap: 2rem;
	}

	.link-page-back {
		font-size: 1.4rem;
		block-size: 4rem;
	}

	.link-page-back::before {
		inline-size: 1.4rem;
		block-size: 1.2rem;
	}
}

/* ====================================
	タブレット専用スタイル（768px～1079px）
===================================== */
@media screen and (768px <=width < 1080px) {
	.desktop-only {
		display: none;
	}

	#globalFooterNavi ul {
		padding-inline: 10%;
	}
}

/* ====================================
	PC専用スタイル（1080px～）
===================================== */
@media print,
screen and (1080px <=width) {

	.outer-base-width.base90 {
		padding-inline: 5%;
	}

}

/* ====================================
	大画面PC専用スタイル（1200px～）
===================================== */
@media screen and (1200px <=width) {

	.base-width-pc,
	.base-width {
		max-inline-size: 1200px;
		margin-inline: auto;
	}

	.outer-base-width.base90 .base-width {
		max-inline-size: 1080px;
	}
}

/* ====================================
	印刷専用スタイル
===================================== */
@media print {
	body {
		inline-size: 960px;
		margin-inline: auto;
	}
}