@charset "utf-8";

#GlobalNaviMenu > .megamenu2023-Current > a,
.megamenu2023 {
	--bg-main: #f2f2f2;/* 背景：メイン */
	--bg-LV2: #CC0000;/* 背景：LV2 */
	--bg-LV2main: #ffffff;/* 背景：LV2 */
	--bg-LV2mainS: #ffffff;/* 背景：LV2開始 */
	--bg-LV2mainE: #e9e9e9;/* 背景：LV2終了 */
	--bg-LV3: #dddddd;/* 背景：LV3 */
	--bg-LV3mainS: #f2f2f2;/* 背景：LV3開始 */
	--bg-LV3mainE: #ffffff;/* 背景：LV3終了 */
	--bg-gnavi-current: #CC0000;/* 背景：グローバルナビカレント */
	--fc-gnavi-current: #ffffff;/* 文字色：グローバルナビカレント */
	--bg-wh: #ffffff;/* 背景：白系 */
	--bg-bl: #0C0C0C;/* 背景：黒系 */
	--height-main-header: 40px;/* 高さ：LV1カテゴリリンク */
	--height-right-header: 38px;/* 高さ：LV2カテゴリリンク */
	--balloon-tail-color: var(--bg-main);/* グローバルナビ吹き出し尻尾の色 */
	--balloon-tail-width: 20px;/* グローバルナビ吹き出し尻尾の幅 */
	--balloon-tail-height: 14px;/* グローバルナビ吹き出し尻尾の高さ */
}

/* LV2 背景 */
.megamenu2023 > .mmR.pcVisible {
	background-image:
		/* LV2 右スペース */
		linear-gradient(0deg, var(--bg-main), var(--bg-main)),
		/* LV2 背景設定 */
		linear-gradient(90deg, var(--bg-LV2mainS), var(--bg-LV2mainE) 100%, var(--bg-LV2mainE));
}

/* LV3 背景 */
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap {
	background-image:  linear-gradient(90deg, var(--bg-LV3mainS), var(--bg-LV3mainE) 100%, var(--bg-LV3mainE));
}



.megamenu2023 {
	background: var(--bg-main);
	border-bottom: var(--bg-wh) solid 5px;
}

.megamenu2023 > * {
}

.megamenu2023 > .mm_LV1,
.megamenu2023 > .mm_LV1 li,
.megamenu2023 > .mm_LV1 a {
	height: var(--height-main-header);
	line-height: var(--height-main-header);
	margin: 0 0 20px!important;
	padding: 0;
}
.megamenu2023 > .mm_LV1 {
	padding: 0!important;
}
.megamenu2023 > .mm_LV3 > div > a {
	height: var(--height-right-header);
	line-height: var(--height-right-header);
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.megamenu2023 .mm_LV1 {
	margin: 0 auto 20px!important;
	width: 100%;
	max-width: 1275px;
}

.megamenu2023 .mm_LV1 li {
	display: none;
	padding-left: 20px;
}
.megamenu2023 .mm_LV1 li.pcVisible {
	display: block;
	animation: mm_LV1_IN 500ms ease-out;
}
@keyframes mm_LV1_IN {
	0% {
		opacity: 0;
		transform: translateY(10px);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

.megamenu2023 .mm_LV1 a,
.megamenu2023 .mm_LV3 > div > a {
	position: relative;
	display: inline-flex;
	justify-content: flex-start;
	align-items: center;
	font-size: 20px;
	font-weight: bold;
	color: #0C0C0C!important;
	padding: 4px 25px 0 0;
	margin: 10px 0!important;
}
.megamenu2023 .mm_LV3 > div > div > div > nav > div > a {
	position: relative;
	display: inline-block;
	font-size: 18px;
	font-weight: bold;
	color: #0C0C0C!important;
	padding: 4px 25px 0 0;
}
.megamenu2023 .mm_LV1 a:hover,
.megamenu2023 .mm_LV2 a:hover,
.megamenu2023 .mm_LV3 a:hover {
	color: #CC0000!important;
}
.megamenu2023 .mm_LV2 li > a,
.megamenu2023 .mm_LV2 li > span,
.megamenu2023 .mm_LV3 div > div > div > a,
.megamenu2023 .mm_LV3 div > div > div > nav > a,
.megamenu2023 .mm_LV3 div > div > div > span {
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	padding: 10px 18px 10px 10px;
	line-height: 1.2;
	font-size: 14px;
	color: #0C0C0C!important;
	background: #ffffff;
	cursor: pointer;
	margin-right: 10px;
}
.megamenu2023 .mm_LV2 li > span {
	padding:15px 35px 15px 10px;
}
.megamenu2023 .mm_LV3 div > div > div > span {
	padding: 15px 33px 15px 8px;
	border-left: transparent solid 2px;
	border-right: transparent solid 2px;
}
.megamenu2023 .mm_LV2 li > a:hover,
.megamenu2023 .mm_LV2 li > span:hover,
.megamenu2023 .mm_LV3 > div > div > div > a:hover,
.megamenu2023 .mm_LV3 > div > div > div > nav > a:hover,
.megamenu2023 .mm_LV3 > div > div > div > span:hover {
	background: #ffcccc;
}


.megamenu2023 .mm_LV1 a::after,
.megamenu2023 .mm_LV3 > div > a::after,
.megamenu2023 .mm_LV3 > div > div > div > nav > div > a::after {
	content: "\00A0TOP";
	
}
[lang="ja"] .megamenu2023 .mm_LV1 a::after,
[lang="ja"] .megamenu2023 .mm_LV3 > div > a::after,
[lang="ja"] .megamenu2023 .mm_LV3 > div > div > div > nav > div > a::after {
	content: "\00A0トップへ";

}

.megamenu2023 .mm_LV1 a::before,
.megamenu2023 .mm_LV2 a::after,
.megamenu2023 .mm_LV3 > div > div > div > nav > div > a::before,
.megamenu2023 .mm_LV3 > div > a::before,
.megamenu2023 .mm_LV3 > div > div > div > a::after,
.megamenu2023 .mm_LV3 > div > div > div > nav > a::after {
	content: "";
	position: relative;
	display: block;
	width: 8px;
	height: 8px;
	border-color: #CC0000;
	border-style: solid;
	border-width: 2px 2px 0 0;
	transform: rotate(45deg);
	transition-property: right;
	transition-duration: 180ms;
	transition-timing-function: linear;
}
.megamenu2023 .mm_LV1 a::before,
.megamenu2023 .mm_LV3 > div > a::before,
.megamenu2023 .mm_LV3 > div > div > div > nav > div > a::before {
	position: absolute;
	right: 10px;
	top: calc( 50% - 4px );
}
.megamenu2023 .mm_LV2 a::after,
.megamenu2023 .mm_LV3 > div > div > div > a::after,
.megamenu2023 .mm_LV3 > div > div > div > nav > a::after {
	right: -5px;
	top: -1px;
}
.megamenu2023 .mm_LV2 a:hover::after,
.megamenu2023 .mm_LV3 > div > div > div > a:hover::after,
.megamenu2023 .mm_LV3 > div > div > div > nav > a:hover::after {
	right: -8px;
}

.megamenu2023 .mm_LV1 a:hover::before,
.megamenu2023 .mm_LV2 a:hover::after,
.megamenu2023 .mm_LV3 > div > a:hover::before {
	border-color: #CC0000;
}
.megamenu2023 .mm_LV1 a:hover::before,
.megamenu2023 .mm_LV3 a:hover::before {
	right: 7px;
	border-color: #CC0000;
}

.megamenu2023 .mmL,
.megamenu2023 .mmR {
	max-height: calc( 100% - 40px );
	max-height: calc( 100vh - var(--mmhb2023) - 30px - 20px - var(--height-main-header) );
	overflow-y: auto;
}

.megamenu2023 .mmL {
	left: 0;
	direction: rtl;
	width: 31.37%;
}
.megamenu2023 .mmL > * {
	direction: ltr;
}
.megamenu2023[data-menutype="list"] .mmL {
	width: 100%;
}

.megamenu2023 .mm_LV2 > ul {
	display: none;
	width: 380px;
	max-width: calc( var(--mmvw2023) * 31.37 - 20px );
	margin: -1px 0 0 auto;
	padding: 0!important;
}
.megamenu2023 .mm_LV2 > ul.pcVisible {
	display: block;
}
.megamenu2023 .mm_LV2 > div {
	display: none;
	justify-content: space-between;
	align-items: flex-start;
	width: 1235px;
	max-width: calc( var(--mmvw2023) * 100 - 40px );
	margin: 0 20px 0 auto;
}
.megamenu2023 .mm_LV2 > div.pcVisible {
	display: flex;
	flex-wrap: wrap;
}
.megamenu2023 .mm_LV2 > div > ul {
	width: calc( 33.33% - 1.33px );
}
.menuType-list::after {
	content: "";
	display: block;
	width: calc( 33.33% - 1.33px );
}

.megamenu2023 .mm_LV2 ul > li {
	display: block;
	margin-top: 1px;
	overflow: hidden;
	border-right: var(--bg-main) solid 1px;
}
.megamenu2023 .mm_LV2 ul > li.megamenu2023-Current {
	border-right: none;
}
.megamenu2023 .mm_LV2 li.megamenu2023-Current > * {
	background: var(--bg-LV2)!important;
	color: var(--fc-gnavi-current)!important;
}
.megamenu2023 .mm_LV2 > .pcVisible > * {
	animation-name: mm_LV2_IN;
	animation-duration: 500ms;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}
@keyframes mm_LV2_IN {
	0% {
		opacity: 0;
		transform: translateY(10px);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

.megamenu2023 .mm_LV2 li > ul > li > a {
	border-left: #CC0000 solid 10px;
}

.megamenu2023 .mm_LV2 li > span > span::before,
.megamenu2023 .mm_LV2 li > span > span::after,
.megamenu2023 .mm_LV3 div > div > span > span::before,
.megamenu2023 .mm_LV3 div > div > span > span::after {
	content: "";
}
.megamenu2023 .mm_LV2 li > span > span,
.megamenu2023 .mm_LV2 li > span > span::before,
.megamenu2023 .mm_LV2 li > span > span::after,
.megamenu2023 .mm_LV3 div > div > span > span,
.megamenu2023 .mm_LV3 div > div > span > span::before,
.megamenu2023 .mm_LV3 div > div > span > span::after {
	position: absolute;
	display: block;
	width: 20px;
	height: 1px;
	background: #bbbbbb;
}
.megamenu2023 .mm_LV2 li > span:hover > span,
.megamenu2023 .mm_LV2 li > span:hover > span::before,
.megamenu2023 .mm_LV2 li > span:hover > span::after,
.megamenu2023 .mm_LV3 div > div > span:hover > span,
.megamenu2023 .mm_LV3 div > div > span:hover > span::before,
.megamenu2023 .mm_LV3 div > div > span:hover > span::after {
	background: #666666;
}
.megamenu2023 .mm_LV3 div > div > span > span,
.megamenu2023 .mm_LV3 div > div > span > span::before,
.megamenu2023 .mm_LV3 div > div > span > span::after {
	transition-property: all;
	transition-duration: 180ms;
	transition-timing-function: ease-out;
}
.megamenu2023 .mm_LV2 li > span > span,
.megamenu2023 .mm_LV2 li > span > span::before,

.megamenu2023 .mm_LV2 li > span > span::after {
	transform-origin: right center;
}
.megamenu2023 .mm_LV3 div > div > span > span {
	transform-origin: center;
}
.megamenu2023 .mm_LV3 div > div > span > span::before,
.megamenu2023 .mm_LV3 div > div > span > span::after {
	transform-origin: right center;
}
.megamenu2023 .mm_LV2 li > span > span,
.megamenu2023 .mm_LV3 div > span > span {
	right: 10px;
	top: calc( 50% - 1.5px );
}
.megamenu2023 .mm_LV2  li > span > span::before,
.megamenu2023 .mm_LV3 div > span > span::before {
	right: 0px;
	top: -6px;
}
.megamenu2023 .mm_LV2  li > span > span::after,
.megamenu2023 .mm_LV3 div > span > span::after {
	right: 0px;
	top: 6px;
}
.megamenu2023 .mm_LV2  li.megamenu2023-Current > span > span::before,
.megamenu2023 .mm_LV2  li.megamenu2023-Current > span > span::after {
	display: none;
}
.megamenu2023 .mm_LV2  li.megamenu2023-Current > span > span {
	right: 0px;
	top: calc( 50% - var(--balloon-tail-width) / 2 );
	width: 0px;
	height: 0px;
	border-color: transparent var(--bg-LV2main) transparent transparent;
	border-style: solid;
	border-width: calc( var(--balloon-tail-width) / 2 ) var(--balloon-tail-height) calc( var(--balloon-tail-width) / 2 ) 0;
	background: transparent;
}
.megamenu2023 .mm_LV3  span.megamenu2023-Current > span {
	width: 0px;
	right: 20px;
	top: calc( 50% + 7px );
	transform: rotate(90deg)
}
.megamenu2023 .mm_LV3  span.megamenu2023-Current > span::before {
	right: 4px;
	top: 0px;
	width: 15px;
	transform: rotate(45deg);
	background: var(--bg-LV2)!important;
}
.megamenu2023 .mm_LV3  span.megamenu2023-Current > span::after {
	right: 4px;
	top: 0px;
	width: 15px;
	transform: rotate(-45deg);
	background: var(--bg-LV2)!important;
}



.megamenu2023 .mm_LV3 > div {
	position: static;
	padding: 0px 0px 15px 15px;
}
.megamenu2023 .mm_LV3 > div > a {
	height: var(--height-right-header);
}
.megamenu2023 .mm_LV3 > div > div {
	display: flex;
	flex-direction: column;
}
.megamenu2023 .mm_LV3 > div > div > div {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
}
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap {
	background-size: 100%;
	margin: 0;
}
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap {
	margin: 0px 0 40px;
}
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap::after {
	display: block;
	overflow: hidden;
	background: #ffffff;
	width: 0;
	margin: 0;
	order: 1;
}
/*
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap:has(> span:nth-of-type(1)):not(:has(> span:nth-of-type(2))):not(:has(> a:nth-of-type(1)))::after
{
	content: "";
	width: calc( 100% / 3 * 2 );
}
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap:has(>span:nth-of-type(1)):has(>a:nth-of-type(1)):not(:has(>span:nth-of-type(2))):not(:has(>a:nth-of-type(2)))::after,
.megamenu2023 .mm_LV3 > div > div > div.megamenu2023-CurrentWrap:has(>span:nth-of-type(1)):has(>span:nth-of-type(2)):not(:has(>span:nth-of-type(3))):not(:has(>a:nth-of-type(1)))::after
{
	content: "";
	width: calc( 100% / 3 );
}
*/
.megamenu2023 .mm_LV3 > div > div > div > a,
.megamenu2023 .mm_LV3 > div > div > div > span {
	display: flex;
	width: calc( 100% / 3 );
	margin: 0;
	border-bottom: var(--bg-LV3) solid 2px;
	order: 1;
}
.megamenu2023 .mm_LV3 > div > div > div > span.megamenu2023-Current {
	border-color: #ffffff;
	background: none;
	/*font-weight: bold;*/
	text-shadow: 0.5px 0px 0 #0C0C0C,-0.5px 0px 0 #0C0C0C;
	border-left: var(--bg-LV3) solid 2px;
	border-right: var(--bg-LV3) solid 2px;
	border-bottom-color: transparent;
}
.megamenu2023 .mm_LV3 > div > div > div > nav {
	display: none;
	flex-wrap: wrap;
	width: 100%;
	border-bottom: var(--bg-LV2) solid 5px;
	padding: 20px 0 10px;
	order: 2;
}
.megamenu2023 .mm_LV3 > div > div > div > nav.megamenu2023-Current {
	display: flex;
}
.megamenu2023 .mm_LV3 > div > div > div > nav > a {
	width: auto;
	background-color: transparent;
}
.megamenu2023 .mm_LV3 > div > div > div > nav > div {
	width: 100%;
	box-sizing: border-box;
	border-left: var(--bg-LV2) solid 4px;
	padding-left: 6px;
	margin-bottom: 10px;
}

.megamenu2023 > .mmR {
	right: 0;
	width:  68.63%;
}
.megamenu2023 > .mmR.pcVisible {
	background-color: var(--bg-LV2main);
	background-size:
		20px 100%,
		100%;
	background-repeat: repeat-y;
	background-position: right;
}
.megamenu2023[data-menutype="list"] > .mmR {
	display: none;
}

.mmR_Inner {
	width: 845px;
	max-width: calc( 100vw / 1275 * 845 - 15px );
}

.megamenu2023 > .mmR .mmTopics,
.megamenu2023 > .mmR .mmR_Inner,
.megamenu2023 > .mmR .mm_LV3 > *,
.megamenu2023 > .mmR .mm_LV4 > * {
	display: none;
}
.megamenu2023 > .mmR .mmTopics.pcVisible,
.megamenu2023 > .mmR.pcVisible .mmR_Inner,
.megamenu2023 > .mmR .mm_LV3,
.megamenu2023 > .mmR .mm_LV4,
.megamenu2023 > .mmR .mm_LV3 > *.pcVisible,
.megamenu2023 > .mmR .mm_LV4 > *.pcVisible {
	display: block;
}
.megamenu2023 > .mmR > .mm_LV3,
.megamenu2023 > .mmR > .mm_LV3 > *,
.megamenu2023 > .mmR > .mm_LV4 {
	position: static;
}

.megamenu2023 > .mmR > .mmTopics {
	padding: 0 20px;
}

.megamenu2023 > .mmR > .mmTopics > .mmTopicsTitle {
	font-size: 24px;
	border-bottom: #666666 solid 1px;
	margin: 0 0 15px;
}
.megamenu2023 > .mmR > .mmTopics > * + .mmTopicsTitle {
	margin-top: 30px;
}

.megamenu2023 > .mmR > .mmTopics > .mmTopicsRecommend {
	display: flex;
}
.megamenu2023 > .mmR > .mmTopics > .mmTopicsRecommend > * {
	margin-right: 10px;
}


/* ================ 自動制御 ================ */
.megamenu2023wrap,
.megamenu2023wrap * {
	box-sizing: border-box!important;
}

.megamenu2023wrap {
	position: absolute;
	top: var(--mmhb2023);
	z-index: 1000;
	width: 100%;
}
@media all and ( max-width: 767px ) {
	.megamenu2023wrap {
		display: none!important;
	}
}

.megamenu2023 {
	position: relative;
	display: none;
	flex-wrap: wrap;
	width: 1275px;
	max-width: 100%;
	max-height: calc( 100vh - var(--mmhb2023) - 30px );
	margin: 0 auto;
	padding: 0 0 20px;
	overflow: hidden;
	box-sizing: border-box;
	border-top: var(--bg-wh) solid 1px;
}
.megamenu2023.pcVisible {
	display: flex;
}

#GlobalNaviMenu > .megamenu2023-Current > a {
	position: relative!important;
	background: var(--bg-gnavi-current)!important;
	color: var(--fc-gnavi-current)!important;
}

#GlobalNaviMenu > .megamenu2023-Current > a::after {
	content: ""!important;
	position: absolute!important;
	left: calc( 50% - var(--balloon-tail-width) / 2 );
	bottom: -2px;
	overflow: hidden!important;
	margin: 0!important;
	padding: 0!important;
	border-style: solid!important;
	border-color: transparent transparent var(--balloon-tail-color);
	border-width: 0 calc( var(--balloon-tail-width) / 2 ) var(--balloon-tail-height);
}

@media all and ( min-width: 768px ) {
:has(.megamenu2023.pcVisible) #HeaderArea2 {
	z-index: 10000;
}
}

#megamenu-contents-company, #megamenu-contents-company_sp {
	border: none;
	width: 100vw;
}
#megamenu-contents-company_sp {
	max-width: 710px;
}

@media all and ( min-width: 768px ) {
	.megamenu2023.pcVisible.viewCompanyInfo {
		background-image: linear-gradient(to bottom, #e5e5e5 60px, #cccccc 60px);
		width: 100%;
		max-width: none;
	}
	.megamenu2023.pcVisible.viewCompanyInfo .mm_LV2 > div {
		margin: 20px auto 0;
		width: 1235px;
		max-width: calc( var(--mmvw2023) * 100 - 40px );
	}
}