@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;
}

caption {
	caption-side: initial;
	text-align: initial;
	font-weight: initial;
	font-style: initial;
	font-size: initial;
	color: initial;
	margin: 0;
	padding: 0;
}

address {
	margin: 0;
}

/* ====================================
	グローバル：ベーススタイル
 ==================================== */
:root {
	--sharp-red: #e6000d;
	--cyan: #116aff;
	--charcoal-gray: #535353;
	--steel-gray: #767676;
	--middle-gray: #959595;
	--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;
	}

	/* グローバルヘッダー */
	.global-header-navi__list a.active,
	.global-header-navi__list a:hover {
		text-decoration: none;
		font-weight: 500;
	}

	/* ブロックスキップリンク	 */
	#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;
	}

	/* パンくず */
	.list-breadcrumb a:hover {
		text-decoration: underline;
	}

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

	/* ボタンリンク */
	.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;
}

/* グローバルフッター */
.global-footer a {
	color: #fff;
}

.global-footer-container {
	background: #3E3B33;
	padding-bottom: 0.5em;
}

/* グローバルフッター・会社情報以下 */
.list-global-footer-navi {
	font-size: 1.1rem;
	font-weight: 400;
	padding-block: 2em;
}

.list-global-footer-navi>li:not(:first-child) {
	margin-top: 1em;
}

/* 注釈マーク */
.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__container {
	display: flex;
	justify-content: center;
	align-items: center;
	min-block-size: 56px;
}

/* グローバルヘッダー・サイトロゴ */
.global-header__logo {
	inline-size: 96px;
}

.global-header__logo a {
	display: grid;
	place-items: center;
}

/* グローバルヘッダー・サイト内検索アイコン */
.global-site-search__button-open {
	inline-size: 30px;
}

/* グローバルヘッダー：検索フォーム */
.global-site-search__form {
	display: flex;
	--global-site-search-height: 4rem;
	block-size: var(--global-site-search-height);
	background: #fff;
	color: #716f63;
	position: relative;
}

.global-site-search__input {
	inline-size: calc(100% - var(--global-site-search-height));
	block-size: 100%;
	border: none;
	padding: 0.4em 0 0.4em 1em;
	font-size: 1.4rem;
}

.global-site-search__input:focus-visible {
	outline-color: #000;
}

.global-site-search__form .poplink {
	top: var(--global-site-search-height);
}

.global-site-search__button-submit {
	display: grid;
	place-items: center;
	block-size: 100%;
	aspect-ratio: 1/ 1;
	background-color: #000;
}

.global-site-search__button-submit img {
	inline-size: 24px;
}

/* ページトップに戻るボタン */
#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;
}

.global-footer__navi {
	background: #3e3b33;
}

/* コピーライト表記 */
.copy-right {
	background: #3e3b33;
	border-top: 1px solid #535148;
	padding-block: 1em;
}

.copy-right a {
	display: block;
	font-size: 1.2rem;
	font-weight: 400;
	color: #fff;
	inline-size: fit-content;
	margin-inline: auto;
}

/* 注釈 */
.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";
}

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

	/* グローバルヘッダー */
	.global-header {
		background: #fff;
		position: sticky;
		top: 0;
		z-index: 15;
		border-bottom: 1px solid #e6e6e6;
		box-shadow: 0 0 5px #eee;
	}

	.global-header-container {
		block-size: 56px;
		padding-top: 14px;
		padding-bottom: 9px;
		position: relative;
	}

	.global-header__button {
		display: grid;
		place-items: center;
		inline-size: 24px;
		position: absolute;
		top: 16px;
		left: 5%;
	}

	.global-header__button img:not(.is-active) {
		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;
	}

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

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

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

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

	.global-header-navi__list>li>a::before,
	.global-header-navi__sub-list>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;
	}

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

	.global-header-navi__list>li>a.is-open[data-accordion-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;
	}

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

	.global-header-navi-accordion__list>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;
	}

	.list-global-navi-social-index {
		font-size: 1.4rem;
		font-weight: 400;
		text-align: center;
		margin-bottom: 1rem;
	}

	.list-global-navi-social-index-link {
		display: inline-block;
		position: relative;
		padding-left: 1.2em;

	}

	.list-global-navi-social-index-link::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		background: url('/assets/common/images/chevron-right-solid.svg') no-repeat center center/auto 100%;
		display: inline-block;
		inline-size: 1em;
		block-size: 1em;

	}

	/* グローバルヘッダー：検索フォーム */
	.global-site-search {
		inline-size: 100%;
		padding: 15px 5%;
		background-color: var(--white-gray);
	}

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

	.global-site-search__wrapper {
		display: none;
	}

	.global-header-search {
		display: none;
	}

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

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

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

	.global-site-search 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;
	}

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

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

	/* グローバル製品フッター */
	.global-footer-sitemap__navi {
		display: none;
	}
}

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

	.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;
	}
}

/* ====================================
	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;
	}

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

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

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

	div.poplink.pcia {
		top: 160px;
	} */

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

	.global-footer-sitemap__container {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		column-gap: 2%;
	}

	.list-footer-navi>li {
		font-size: 1.4rem;
		font-weight: 400;
	}

	.list-footer-navi>li:not(:first-of-type) {
		margin-top: 0.4em;
	}

	.list-footer-sub-navi>li {
		font-size: 1.5rem;
		font-weight: 500;
	}

	.list-footer-sub-navi>li:not(:first-of-type) {
		margin-top: 1rem;
	}

	.list-footer-sub-navi>li.mt-space {
		margin-top: 4rem;
	}

	/* サステナビリティ・他サイトリンク */
	.footer-navi-groups {
		display: flex;
		flex-direction: column;
		row-gap: 3.5rem;
	}

	.global-footer__sitemap-category:has(a[href="/recruit/"]) {
		margin-bottom: 0;
	}

	/* ソーシャルメディアアカウントリンク */
	.global-footer-sitemap__social {
		background: #727068;
		padding-block: 2.4rem;
	}

	.global-footer-sitemap__social-container {
		display: flex;
		flex-wrap: wrap;
		column-gap: 4rem;
		inline-size: 100%;
		align-items: center;
		justify-content: end;
	}

	.footer-navi-social-index {
		font-size: 1.4rem;
		font-weight: 500;
		text-align: center;
	}

	.list-footer-navi-social {
		display: flex;
		column-gap: 3rem;
	}

	.list-footer-navi-social a {
		display: grid;
		place-items: center;
		aspect-ratio: 1 / 1;
		inline-size: 4rem;
	}

	.list-footer-navi-social img {
		inline-size: auto;
		block-size: 4rem;
	}

	/* リンク見出し */
	.global-footer__sitemap-category {
		font-size: 2rem;
		font-weight: 700;
		margin-bottom: 0.7em;
	}

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

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

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

	.mobile-only {
		display: none;
	}

	/* グローバルヘッダー */
	.global-header__container {
		justify-content: space-between;
		column-gap: 10px;
		min-block-size: 7.2rem;
	}

	/* グローバルヘッダー・サイトロゴ */
	.global-header__logo {
		inline-size: 125px;
	}

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

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

	.global-header-navi-accordion[data-accordion="service"] {
		position: absolute;
		left: 50%;
		top: 4rem;
		z-index: 2;
		transform: translateX(-50%);
		inline-size: 10em;
		background: #fff;
		padding: 2rem 2em;
		border-radius: 20px;
		box-shadow: 0px 0px 4px 0px #0000001A;
	}

	.global-header-navi-accordion__list {
		display: flex;
		flex-wrap: wrap;
		row-gap: 1.6rem;
	}

	.global-header-navi-accordion__list>li {
		inline-size: 100%;
		text-align: center;
	}

	/* グローバルナビゲーション */
	.global-header-navi {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0 18px;
		font-size: 1.5rem;
		font-weight: 400;
		block-size: 100%;
		padding: 0.5em 0;
	}

	.global-header-navi__container {
		display: contents
	}

	.global-header-navi__list {
		display: flex;
		flex-wrap: wrap;
		column-gap: 24px;
	}

	.global-header-navi__list a {
		display: inline-block;
		position: relative;
	}

	a[data-accordion-target="service"] {
		padding-right: 1.5em;
		background: url('/assets/common/images/chevron-down-solid.svg') no-repeat right center / auto 0.6lh;
	}

	a[data-accordion-target="service"].is-open {
		background-image: url('/assets/common/images/chevron-up-solid.svg');
	}

	.global-header-navi__list a::before,
	.global-header-navi__list a:hover::before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		bottom: -0.2rem;
		display: block;
		block-size: 1px;
		background: var(--sharp-red);
	}

	.global-header-navi__list a::before {
		inline-size: 0;
		margin-inline: auto;
		transition: inline-size 0.3s ease;
	}

	.global-header-navi__list a.active::before {
		transition: none;
	}

	.global-header-navi__list a.active::before,
	.global-header-navi__list a:hover::before {
		inline-size: 100%;
	}

	.global-header-navi__list>li:last-of-type {
		padding-right: 18px;
		border-right: 1px solid #000;
	}

	.global-header-navi__list>li:has(#globalHeaderNaviService) {
		position: relative;
	}

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

	/* サイト内検索フォーム */
	.global-site-search__overlay {
		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: 11;
	}

	.global-site-search__container {
		background: var(--white-gray);
	}

	.global-site-search__wrapper {
		padding-block: 5rem;
		position: relative;
	}

	.global-site-search__form {
		inline-size: 620px;
		--global-site-search-height: 5rem;
		margin-inline: auto;
	}

	.global-site-search__button-close {
		position: absolute;
		right: 0;
		top: 2rem;
		display: block;
		inline-size: 26px;
		block-size: 26px;
	}

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

	#dialog-label {
		font-size: 2.4rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1em;
	}

	.global-site-search__form {
		display: flex;
		justify-content: space-between;
		inline-size: 750px;
		margin-inline: auto;
	}

	/* パンくずリスト */
	#breadcrumb {
		background: none;
		border-top: solid 1px var(--light-gray);
	}

	.list-breadcrumb>li::before {
		margin-inline: 0.8em;
	}

	/* グローバルフッター */
	.list-global-footer-navi {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 1em;
		font-size: 1.1rem;
		font-weight: 400;
		padding-block: 2em;
	}

	.list-global-footer-navi>li {
		padding-inline: 1em;
		border-left: solid 1px #fff;
	}

	.list-global-footer-navi>li:not(:first-child) {
		margin-top: 0;
	}

	.list-global-footer-navi>li:first-child {
		border-left: none;
	}
}


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

	.base-width-pc,
	.base-width {
		max-inline-size: 120rem;
		margin-inline: auto;
	}

	.outer-base-width.base90 .base-width {
		max-inline-size: 108rem;
	}
}

/* ====================================
	印刷専用スタイル
===================================== */
@media print {
	@page {
		margin: 10mm;
	}

	body {
		background: #fff !important;
	}

	/* 不要な要素を非表示 */
	.global-header-navi,
	.global-header__button,
	.global-footer,
	#pageTop,
	video,
	iframe {
		display: none !important;
	}

	/* 改ページ制御 */
	table,
	img,
	pre {
		break-inside: avoid;
	}
}