/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/
.fs-l-header {
	padding-top: 55px;
}

/* #header {
	padding: 2rem 2.8rem;
} */
#header .hBox {
	align-items: center;
}

#header .naviList {
	margin: 0 0 2rem 5.5rem;
}

#header .naviList li a {
	padding: 0 2.5rem;
	font-size: 1.4rem;
	font-weight: normal;
	position: relative;
	display: block;
}

#header h1#desktop_logo {
	padding: 0;
}

#header .header-top:has(#_desktop_top_menu:not(.no-hover) li.menu__item--0:hover) li a {
	color: #ffffff;
}

@media all and (min-width: 897px) {
	#header .naviList li a::after {
		display: block;
		content: "";
		position: absolute;
		bottom: -4px;
		left: 5px;
		width: calc(100% - 10px);
		height: 1px;
		opacity: 1;
		transform: scale(0);
		transform-origin: center;
		background-color: #fff;
		transition: transform 300ms
	}

	#header .naviList li a:hover::after {
		transform: scale(1)
	}

	#header .naviList>li>a::before {
		content: "";
		display: block;
		position: absolute;
		top: calc(100% + 5.5rem);
		left: 40%;
		width: 1px;
		height: 20px;
		border: 10px solid transparent;
		border-left-width: 7px;
		border-right-width: 7px;
		border-top-color: #003DA6;
		z-index: 100;
		scale: 0;
		transform-origin: top center;
		transition: scale 250ms ease;
	}

	#header .naviList>li>a:hover::before {
		scale: 1;
		transition: scale 250ms ease 250ms
	}

}

#header .btnList {
	margin: 0 0 1rem 0;
}

#header .btnList li {
	margin: 0 3rem;
}

@media all and (min-width: 897px) {
	#header {
		position: relative;
	}

	#header .btnList li a:hover {
		opacity: 0.7;
	}
}

@media all and (max-width: 896px) {
	#header {
		padding: 0 0 1rem;
		z-index: 99;
		position: relative;
	}

	#header h1 {
		width: 13rem;
	}

	#header h1 a {
		display: block;
	}

	#header h1 a img {
		width: 100%;
	}

	#header .hBox {
		padding: 1rem 0.8rem 0;
		position: relative;
		z-index: 99;
		background-color: #fff;
	}

	#header .logo {
		width: 13.4rem;
	}

	#header .btnList {
		margin: 0.9rem 0 0;
		padding: 0;
		width: 18.5rem;
		justify-content: flex-start;
		box-sizing: border-box;
	}

	#header .btnList li {
		margin: 0 0.8rem;
		width: 2.5rem;
	}

	#header .btnList li a {
		display: block;
	}

	#header .btnList li a img {
		width: 100%;
	}

	#header .btnList li:first-child {
		width: 2.3rem;
	}
}

#header.l-header {
	position: absolute;
	background-color: rgb(255 255 255 / 60%);
	transition: background-color .2s;
	top: 0;
	left: 0;
	right: 0;
}

.scrolled #header.l-header {
	position: fixed;
	background-color: #ffffff;
	transition: background-color 0.2s;
}

@media screen and (max-width: 600px) {
	#header.l-header {
		position: fixed;
		background: #ffffff;
	}
}

/*------------------------------------------------------------
    naviList
------------------------------------------------------------*/
@media all and (min-width: 897px) {
	.ci-x-circle {
		background: url(../img/common/x-circle.png) no-repeat center center / 2.5rem;
	}

	.ci-x-circle:hover {
		opacity: 0.7;
	}

	.ci {
		width: 2.5rem;
		height: 2.5rem;
		display: inline-block;
		line-height: 1;
		mask-size: 2.5rem 100%;
		-webkit-mask-size: 2.5rem 100%;
		mask-position: center;
		-webkit-mask-position: center;
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		box-sizing: content-box;
		background-color: transparent;
		vertical-align: middle;
		position: relative;
		top: -1px;
	}

	#_desktop_top_menu [data-close="sub-menu-desktop"] {
		margin: -40px -6px;
	}
}

@media (min-width: 897px) {
	#header .col-lg {
		flex-basis: 0%;
		flex-grow: 1;
		min-width: 0;
		max-width: 100%;
	}

	#header .col-lg-4 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%;
	}

	#header .col-lg-8 {
		max-width: 100%;
		width: 100%;
	}
}

@media (prefers-reduced-motion:reduce) {
	#header .btn {
		transition: none;
	}
}

@media (min-width: 897px) {
	#header .d-lg-none {
		display: none !important;
	}

	#header .d-lg-block {
		display: block !important;
	}

	#header .d-lg-flex {
		display: flex !important;
	}
}

@media (min-width: 897px) {
	#header .menu__item-header {
		height: 100%;
	}

	#header .menu-sub {
		position: absolute;
		opacity: 0;
		width: 100%;
		left: 0;
		top: 100%;
		z-index: -1;
		transition: all .5s ease;
	}

	#header .menu-sub__content>ul {
		padding: 10px;
		background-color: #fff;
		box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .2);
	}

	#header .menu__item--active .menu-sub {
		z-index: 2;
		opacity: 1;
	}

	#header .menu-sub__list--1 {
		display: flex
	}

	#header .menu__item--1 {
		padding-right: 10px;
		padding-left: 10px;
	}

	#header .menu__item-link--1 {
		text-transform: uppercase;
		color: #000;
	}

	#header .menu__item-link--1 .menu__item-link {
		color: #212529;
	}
}

@media (hover: none) {

	#header .btn-secondary:focus,
	.btn-secondary:active {
		background-color: #ECEFF4 !important;
	}
}

#header .d-flex,
.pack-product-container,
.pack-product-quantity,
.social-sharing {
	display: flex !important;
}

#header .justify-content-end {
	justify-content: flex-end !important;
}

#header .justify-content-between {
	justify-content: space-between !important;
}

#header .align-items-end {
	align-items: flex-end !important;
}

#header .align-items-center {
	align-items: center !important;
}

#header .align-self-start {
	align-self: flex-start !important;
}

#header .align-self-center {
	align-self: center !important;
}

.home:not(.scrolled):not(.search-bar-open):not(.main-menu-open) header#header .header-top {
	background: transparent;
}

@media all and (min-width: 897px) {
	#header .img-fluid {
		max-width: 100%;
		height: auto;
		background-color: #D9D9D9;
	}

	#header .container,
	.l-wrapper,
	.l-wrapper--boxed,
	main>.notifications-container {
		width: 100%;
		padding-right: 15px;
		padding-left: 15px;
		margin-right: auto;
		margin-left: auto;
	}

	#header .container-fluid,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		width: 100%;
		padding-right: 15px;
		padding-left: 15px;
		margin-right: auto;
		margin-left: auto;
	}

	#header .row {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	#header .col {
		flex-basis: 0%;
		flex-grow: 1;
		min-width: 0;
		max-width: 100%;
	}

	#header .col-6,
	.product-miniature {
		flex: 0 0 50%;
		max-width: 48%;
	}

	#header .col-12,
	.col-xs-12 {
		flex: 0 0 100%;
		/* max-width: 100%; */
		max-width: 1230px;
		margin: 0 auto;
	}

	#header .btn {
		display: inline-block;
		font-weight: 400;
		color: #212529;
		text-align: center;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: .375rem .75rem;
		font-size: 1rem;
		line-height: 1.5;
		border-radius: 0;
		transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	}

	#header .btn:hover {
		color: #212529;
		text-decoration: none;
	}

	#header .btn.focus,
	.btn:focus {
		outline: 0;
		box-shadow: 0 0 0 .2rem rgba(47, 181, 210, .25);
	}

	#header .btn.disabled,
	.btn:disabled {
		opacity: .65;
		box-shadow: none;
	}

	#header .btn:not(:disabled):not(.disabled) {
		cursor: pointer;
	}

	#header .btn:not(:disabled):not(.disabled).active,
	.btn:not(:disabled):not(.disabled):active {
		box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
	}

	#header .btn:not(:disabled):not(.disabled).active:focus,
	.btn:not(:disabled):not(.disabled):active:focus {
		box-shadow: 0 0 0 .2rem rgba(47, 181, 210, .25), inset 0 3px 5px rgba(0, 0, 0, .125);
	}

	#header a.btn.disabled,
	fieldset:disabled a.btn {
		pointer-events: none;
	}

	#header .btn-secondary {
		color: #fff;
		background-color: #6c757d;
		border-color: #6c757d;
		box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075);
	}

	#header .btn-secondary.focus,
	.btn-secondary:focus,
	.btn-secondary:hover {
		color: #fff;
		background-color: #5a6268;
		border-color: #545b62;
	}

	#header .btn-secondary.focus,
	.btn-secondary:focus {
		box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .15), 0 1px 1px rgba(0, 0, 0, .075), 0 0 0 .2rem rgba(130, 138, 145, .5);
	}

	#header .btn-secondary.disabled,
	.btn-secondary:disabled {
		color: #fff;
		background-color: #6c757d;
		border-color: #6c757d;
	}

	#header .btn-secondary:not(:disabled):not(.disabled).active,
	.btn-secondary:not(:disabled):not(.disabled):active,
	.show>.btn-secondary.dropdown-toggle {
		color: #fff;
		background-color: #545b62;
		border-color: #4e555b;
	}

	#header .btn-secondary:not(:disabled):not(.disabled).active:focus,
	#header .btn-secondary:not(:disabled):not(.disabled):active:focus,
	#header .show>.btn-secondary.dropdown-toggle:focus {
		box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125), 0 0 0 .2rem rgba(130, 138, 145, .5);
	}

	#header .collapse:not(.show) {
		display: none;
	}

	#header .clearfix:after {
		display: block;
		clear: both;
		content: "";
	}

	#header .d-none {
		display: block;
	}

	#header .h-100 {
		height: 100% !important;
	}

	#header .mb-2,
	.my-2 {
		margin-bottom: .5rem !important;
	}

	#header .ml-2,
	.mx-2 {
		margin-left: .5rem !important;
	}

	#header .mt-5,
	#header .my-5 {
		margin-top: 3rem !important;
	}

	#header .mb-5,
	#header .my-5 {
		margin-bottom: 3rem !important;
	}

	#header .pr-3,
	#header .px-3 {
		padding-right: 1rem !important;
	}

	#header .ml-auto,
	#header .mx-auto {
		margin-left: auto !important;
	}

	#header .text-wrap {
		white-space: normal !important;
	}

	#header .menu__item-link--top {
		color: #343a40;
		font-weight: 400;
		text-transform: uppercase;
		display: block;
		padding: .5rem;
	}

	#header .menu-top {
		display: flex;
		justify-content: center;
		margin: 0;
		position: relative;
	}

	ul {
		list-style: none;
		padding-left: 0;
	}

	#header {
		transition: box-shadow 400ms ease;
	}

	#header h1 {
		padding: 0 0 0 2rem;
	}

	#header .header-top #header-top-bar {
		padding: 0;
	}

	#header .header-top:has(#_desktop_top_menu:not(.no-hover) li.menu__item--0:hover) {
		background-color: var(--cpx-primary) !important;
		--nav-color: #FFF;
	}

	.header-top.d-none.d-lg-block:has(li:hover) {
		background-color: #003da5;
	}

	.header-top.d-none.d-lg-block:has(li:hover) a.menu__item-link--top.menu__item-link--hassubmenu.d-flex span.align-self-center {
		color: #ffffff;
	}

	#header .header-top:has(#_desktop_top_menu:not(.no-hover) li.menu__item--0:hover) .btnList li img {
		filter: grayscale(100%) brightness(1000%);
	}

	#header .header-top #nav-bar {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}

	#top-menu .menu-sub__content .h3 {
		text-transform: uppercase;
		color: var(--cpx-grey);
	}

	#top-menu .menu-sub__content .h3 a {
		color: var(--cpx-grey);
	}

	#top-menu .subcat-teaser {
		font-weight: normal;
		--teaser-font-color: #FFF;
		color: var(--teaser-font-color);
	}

	#top-menu .subcat-teaser.sub-category-105,
	#top-menu .subcat-teaser.sub-category-119 {
		--teaser-font-color: var(--cpx-text);
	}

	#top-menu .subcat-teaser .cat-label {
		color: #fff;
		font-size: 2.2rem;
		letter-spacing: .62px;
		font-weight: 500;
		text-transform: uppercase;
		line-height: 1.22;
	}

	#top-menu .subcat-teaser .cat-label+div {
		display: none !important;
	}

	#top-menu .subcat-teaser i {
		background-color: var(--teaser-font-color);
	}

	#top-menu .subcat-teaser p {
		font-style: italic;
		font-size: 1.6rem;
		line-height: 1.2;
		margin-bottom: 0;
		letter-spacing: -.06px;
	}

	#top-menu .subcat-teaser .subcat-text-wrap {
		position: absolute;
		width: 100%;
		right: 0;
		bottom: 0;
		padding: 20px;
		text-align: right;
		box-sizing: border-box;
	}

	#top-menu .blog-logo svg {
		width: 120px;
		height: auto;
	}

	#_desktop_top_menu #top-menu {
		height: 101px;
	}

	#_desktop_top_menu #top-menu li.menu__item--0 {
		margin: 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	#_desktop_top_menu #top-menu .menu__item-header {
		height: auto;
	}

	#_desktop_top_menu li.menu__item--0.menu__item--hassubmenu::after {
		content: "";
		display: block;
		position: absolute;
		top: 100%;
		width: 14px;
		height: 20px;
		border: 10px solid transparent;
		border-left-width: 7px;
		border-right-width: 7px;
		border-top-color: #003da5;
		z-index: 100;
		scale: 0;
		transform-origin: top center;
		transition: scale 250ms ease;
		box-sizing: border-box;
	}

	#_desktop_top_menu li.menu__item--0.menu__item--hassubmenu:hover::after {
		scale: 1;
		transition: scale 250ms ease 250ms;
	}
/* 
	#_desktop_top_menu:not(.no-hover) li.menu__item--0.menu__item--hassubmenu:hover::after {
		scale: 1;
		transition: scale 250ms ease 250ms;
	}

	#_desktop_top_menu:not(.no-hover) li.menu__item--0:hover .menu__item-link--top::after {
		transform: scale(1) !important;
	} */

	#_desktop_top_menu .menu-sub.collapse:not(.show) {
		display: block;
	}

	#_desktop_top_menu .menu-sub {
		width: 100svw;
		height: calc(100svh - 10rem) !important;
		top: 100%;
		left: 56%;
		transform: translateX(-50svw);
		background-color: #FFF;
		pointer-events: none;
		opacity: 0;
		z-index: 2;
		overflow-y: scroll;
		overscroll-behavior: contain;
		-ms-overflow-style: none;
		scrollbar-width: none;
		max-height: none;
		transition: opacity 400ms ease;
	}

	.scrolled #_desktop_top_menu .menu-sub {
		height: calc(100svh - var(--hh)) !important;
	}

	#_desktop_top_menu .menu-sub>.container {
		height: 100%;
		max-width: 123rem;
	}

	#_desktop_top_menu .menu-sub::-webkit-scrollbar {
		display: none;
	}

	#_desktop_top_menu:has(li.menu__item--0:hover) .menu-sub {
		transition-delay: 200ms;
	}

	#_desktop_top_menu:not(.no-hover):has(li.menu__item--0:hover) li.menu__item--0 {
		height: 100%;
	}

	#header li:hover .menu-sub {
		opacity: 1;
		z-index: 99;
		transition-delay: 0ms;
		pointer-events: auto;
	}

	#_desktop_top_menu .sub-menu-header+.row {
		padding-bottom: 30px;
		flex: 1 0 auto;
	}

	#_desktop_top_menu:not(.no-hover) li.menu__item--0 .menu-sub:has(.menu-sub__content:not(:hover)):hover {
		pointer-events: none !important
	}

	#_desktop_top_menu .menu-sub__content {
		height: calc(100% + 1px) !important;
		padding-top: 5rem;
		display: flex;
		flex-direction: column;
	}

	#_desktop_top_menu [data-close="sub-menu-desktop"] {
		margin: -40px -6px;
	}

	#_desktop_top_menu .menu-sub__content .h3 {
		margin-bottom: 35px;
		font-size: 2.8rem;
		font-weight: 400;
	}

	#_desktop_top_menu .subcat-teaser img {
		max-height: 22rem;
		width: 100%;
		object-fit: cover;
	}

	#header .menu-teaser {
		position: relative;
		min-height: 200px;
		flex: 1 0 auto;
	}

	#header .menu-teaser>img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		z-index: 1;
	}

	#header .menu-teaser .text-wrap {
		position: relative;
		padding: 25px;
		max-width: 430px;
		z-index: 2;
	}

	#header .menu-teaser .text-wrap h4 {
		font-size: 2.2rem;
		text-transform: uppercase;
		margin-bottom: 15px;
	}

	#header .menu-teaser .text-wrap>* {
		color: #FFF;
		line-height: 1.125;
	}

	#header .menu-teaser.cat-id-120 .text-wrap>* {
		color: var(--cpx-text);
	}

	#header .menu-teaser a.btn {
		color: var(--cpx-grey) !important;
		margin-top: 15px;
	}

	:root {
		--cpx-primary: #003da5;
		--cpx-grey: #595959;
		--cpx-light-grey: #ededed;
		--cpx-sea: #00a3e0;
		--cpx-turquoise: #009ca6;
		--cpx-green-apple: #97d700;
		--cpx-yellow: #fce300;
		--cpx-orange: #ff8200;
		--cpx-swiss-red: #da291c;
		--cpx-hot-pink: #e31c79;
		--cpx-baby-pink: #f277c6;
		--cpx-light-wisteria: #b580d1;
		--cpx-eminence: #702f8a;
		--cpx-green: #4DA767;
		--cpx-aquamarine: #71CC98;
		--cpx-text: #595959;
		--nav-color: var(--cpx-text);
	}

	#header .btn {
		border: none;
		font-size: 1.7rem;
		color: #595959;
		--icon-color: #595959;
	}

	#header .btn:focus {
		box-shadow: none;
	}

	#header .btn:hover,
	.btn:active {
		color: #003da5;
		--icon-color: #003da5;
	}

	header#header {
		position: relative;
		position: sticky;
		top: -1px;
		left: 0;
		width: 100%;
		z-index: 999;
		background-color: #fff;
	}

	#header-top-bar .search-toggle i {
		display: block;
		font-size: 2.4rem;
		width: 2.5rem;
		height: 2.6rem;
		line-height: 2.6rem;
	}

	#_desktop_top_menu #top-menu li {
		flex: 0 1 auto;
		width: auto;
		height: 100%;
		max-width: 100%;
		margin-left: 5px;
		margin-right: 5px;
	}

	.menu__item-link--top {
		font-weight: 500;
		font-size: 1.3rem;
		color: var(--cpx-grey);
		letter-spacing: .5px;
		padding-top: 0;
		padding-bottom: 0;
	}

	.menu__item-link--sub {
		font-weight: 400;
		color: var(--cpx-grey);
	}

	#_desktop_top_menu .menu__item-link--top {
		letter-spacing: .5px;
		font-size: 1.4rem;
		padding-bottom: 0;
		text-align: center;
		color: var(--cpx-text);
	}

	#_desktop_top_menu .menu__item-link--top span {
		align-self: flex-end !important;
		font-weight: normal;
	}

	#header .menu__item a:hover,
	.menu__item a:active,
	.menu__item--current>a,
	.menu__item--current>div>a {
		text-decoration: none;
	}

	#header .menu__item--current>a,
	.menu-sub__content>ul {
		box-shadow: none;
	}

	#header .menu-sub__content>ul {
		background: transparent;
	}

	#header .icon-buttons {
		align-items: center;
	}

	#header .icon-buttons a.btn {
		color: #FFF;
		text-transform: uppercase;
		font-weight: 500;
		letter-spacing: .8px;
		font-size: 1.4rem;
	}

	#header .icon-buttons a.btn,
	#header .icon-buttons a.text,
	#header .icon-buttons button.btn {
		padding: 10px;
	}

	#header .icon-buttons a.text {
		font-size: 1.7rem;
		font-weight: 400;
		color: #595959;
		text-transform: uppercase;
		margin-left: 10px;
	}

	#header .icon-buttons i.ci {
		background-color: #595959;
		transition: background-color 500ms ease;
	}

	#header .header-top .icon-buttons a.text {
		color: var(--cpx-primary);
	}

	#header .header-top .icon-buttons a {
		color: #595959;
	}

	#header .header-top .icon-buttons a:hover,
	.header-top .icon-buttons a.active {
		color: var(--cpx-primary);
	}

	#header .header-top .icon-buttons .btn:hover i.ci,
	.header-top .icon-buttons .btn.active i.ci {
		background-color: var(--cpx-primary);
	}

	#header .mobile-header .icon-buttons a.btn,
	.mobile-header .icon-buttons button.btn {
		min-width: 40px;
	}

	#menu-icon svg path {
		stroke: #003da5;
	}

	#_desktop_top_menu .menu__item-link--top,
	.icon-buttons a.text {
		color: #003da5;
	}

	#header .icon-buttons i.ci {
		background-color: #003da5;
	}

	#_desktop_top_menu li .menu__item-link--top {
		padding: 0 2.5rem;
		position: relative;
		color: #000000;
	}

    #_desktop_top_menu li:not(#category-2) .menu__item-link--top::after {
        display: block;
        content: "";
        position: absolute;
        bottom: -4px;
        left: 25px;
        width: calc(100% - 50px);
        height: 1px;
        opacity: 1;
        transform: scale(0);
        transform-origin: center;
        background-color: #ffffff;
        transition: transform 300ms;
    }

	#_desktop_top_menu li:hover:not(#category-2) .menu__item-link--top::after {
		transform: scale(1) !important;
	}

	[class^="cat-id-"] {
		--cat-text-color: var(--cat-color);
	}

	#header .cat-id-119 {
		--cat-color: var(--cpx-light-grey);
		--cat-text-color: var(--cpx-grey);
	}

	#header .cat-id-123 {
		--cat-color: var(--cpx-sea);
	}

	#header .cat-id-120 {
		--cat-color: #000;
	}

	#header a.box-link {
		display: block;
		position: absolute;
		background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		text-indent: -9999px;
		overflow: hidden;
		z-index: 10;
	}

	#top-menu .subcat-teaser:hover {
		opacity: 0.7;
	}

	#header .mb-lg-5,
	.my-lg-5 {
		margin-bottom: 3rem !important;
	}

	#header .position-relative {
		position: relative !important;
	}
}

@media all and (max-width: 896px) {
	#header .align-items-center {
		padding: 1rem;
		z-index: 99;
		position: relative;
		/* background-color: #fff; */
	}
}

/*------------------------------------------------------------
    menu
------------------------------------------------------------*/
@media all and (max-width: 896px) {
	.menu {
		width: 2.4rem;
		height: 2.6rem;
		position: absolute;
		left: auto;
		right: 1.9rem;
		top: 1.2rem;
		cursor: pointer;
		z-index: 100;
		transition: opacity .25s ease;
		-webkit-transition: all .3s ease;
	}

	#header .menu span {
		width: 100%;
		height: 0.2rem;
		display: block;
		position: absolute;
		left: 0;
		top: 0.6rem;
		background: #003DA6;
		-webkit-transition: all .35s ease;
		transition: all .35s ease;
		cursor: pointer;
	}

	#header .menu span:nth-child(2) {
		top: 1.6rem;
	}

	#header .menu span:nth-child(3) {
		top: 2.6rem;
	}

	#header .menu.on .top {
		-webkit-transform: translateY(0.7rem) translateX(0) rotate(-45deg);
		-ms-transform: translateY(0.7rem) translateX(0) rotate(-45deg);
		transform: translateY(1.1rem) translateX(0) rotate(-45deg);
		background: #003DA6;
	}

	#header .menu.on .middle {
		opacity: 0;
		background: #003DA6;
	}

	#header .menu.on .bottom {
		-webkit-transform: translateY(-0.7rem) translateX(0) rotate(45deg);
		-ms-transform: translateY(-0.7rem) translateX(0) rotate(45deg);
		transform: translateY(-0.9rem) translateX(0) rotate(45deg);
		background: #003DA6;
	}

	#header .menuBox {
		width: 100%;
		height: 100%;
		display: none;
		position: fixed;
		left: 0;
		top: 70px;
		overflow-y: auto !important;
		box-sizing: border-box;
		z-index: 5;
		background-color: #003DA6;
	}

	#gNavi .naviList {
		margin: 0;
		padding: 3rem 0 5rem;
		color: #fff;
		display: block;
	}

	#gNavi .naviList li {
		margin: 0;
		width: 100%;
	}

	#gNavi .naviList li a {
		padding: 20px 0 23px;
		font-size: 1.7rem;
		display: block;
		color: #fff;
	}

	#gNavi .naviList li dt {
		padding: 1.3rem 2.2rem;
		margin: 0;
		position: relative;
		font-size: 2rem;
		font-weight: 600;
		letter-spacing: 1.2px;
	}

	#gNavi .naviList li dt::after {
		position: absolute;
		right: 4.1rem;
		top: 2.2rem;
		width: 2rem;
		height: 1.2rem;
		content: '';
		background: url("../img/common/icon08.png") no-repeat center center / 100%;
	}

	#gNavi .naviList li .on {
		background-color: rgba(255, 255, 255, 0.10);
		;
	}

	#gNavi .naviList li .on::after {
		background-image: url("../img/common/icon09.png");
	}

	#gNavi .naviList li dd {
		display: none;
	}

	/* #gNavi .naviList li .subDl dt {
		padding: 1.4rem 4.2rem 1.5rem;
		font-size: 1.8rem;
		letter-spacing: 0.9px;
	} */
	#gNavi .naviList li .subDl p {
		padding: 0 1.5rem 1.5rem;
		font-size: 1.8rem;
		letter-spacing: 0.9px;
		border-bottom: 1px solid #ffffff;
		font-weight: 600;
	}

	#gNavi .naviList li p {
		padding: 0 15px;
	}

	/* #gNavi .naviList li .subArea {
		padding: 1rem 2rem 2rem 6.2rem;
	} */
	/* #gNavi .naviList li .subArea01 {
		padding-left: 4.2rem;
	} */

	#gNavi .naviList li .subArea li {
		height: 100px;
		border-bottom: 1px solid #ffffff;
	}

	#gNavi .naviList li .subArea li a {
		/* padding: 0.4rem 0; */
		font-size: 1.6rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 15px;
		height: 100%;
	}

	#gNavi .naviList li .subArea li .cat_innerWrap a {
		padding: 0;
	}

	#gNavi .naviList li .subArea li a img {
		margin-right: -15px;
		height: 100%;
		width: auto;
	}

	.menuBox .bannerUl {
		margin-bottom: 8rem;
	}

	.menuBox .bannerUl li {
		margin: 0 2.2rem 3rem;
	}

	.menuBox .bannerUl li img {
		width: 100%;
	}

	.menuBox .bannerUl li:last-child {
		margin-bottom: 0;
	}

	#gNavi .naviList li .subArea .cat_innerWrap {
		position: absolute;
		right: -100%;
		/* 初期状態で画面外に配置 */
		transition: right 0.5s ease;
		/* スライドのアニメーション */
		z-index: 10;
	}

	#gNavi .naviList li .subArea .cat_innerWrap.active {
		right: 0;
		/* 表示する時の位置 */
	}

	#gNavi .naviList .select_target {
		margin-top: 2rem;
	}

	.menuBox.sp #gNavi .cat_innerWrap.active li {
		border: none;
	}

}

/*------------------------------------------------------------
	パンくず
------------------------------------------------------------*/
.fs-c-breadcrumb {
	max-width: 1230px;
	margin: 5rem auto;
}

/*------------------------------------------------------------
	ハンバーガーメニュー
------------------------------------------------------------*/
#gNavi {
	.naviList {
		li {
			.subArea {
				.cat_innerWrap {
					position: fixed;
					top: 6.7rem;
					right: -100%;
					width: 80%;
					height: 100%;
					background: #003DA5;
					transition: right 0.3s ease;
					z-index: 1000;

					/* 必要に応じて調整 */
					&.active {
						right: 0;
						width: 100%;
						top: 6.7rem;
						background: #003DA5;
					}

					.cat_innerList {
						display: flex;
						flex-wrap: wrap;

						.cat_innerList_item {
							width: 50%;
						}
					}

					.innerBackwrap {
						display: flex;
						justify-content: space-between;
						padding: 0rem 1rem 0.5rem;
						align-items: center;
						margin: 1rem 0;

						button {
							background: none;
							border: none;
							font-size: 24px;
							cursor: pointer;

							.fa-chevron-circle-left {
								display: inline-block;
								vertical-align: middle;
								color: #ffffff;
								line-height: 1;
								position: relative;
								width: 0.8em;
								height: 0.8em;
								border: 0.075em solid currentColor;
								background: currentColor;
								border-radius: 50%;
								box-sizing: content-box;

								&:before {
									content: '';
									color: #000;
									width: 0;
									height: 0;
									border-style: solid;
									border-color: transparent;
									border-width: 0.18em 0.31177em;
									border-right-color: currentColor;
									border-left: 0;
									transform: translateX(-15%);
									position: absolute;
									top: 0;
									left: 0;
									right: 0;
									bottom: 0;
									margin: auto;
								}
							}
						}

						p {
							padding: 0;
							border: none;
						}
					}

					.submenuItem {
						position: relative;

						.cat_innerName {
							position: absolute;
							bottom: 5px;
							right: 5px;
							text-align: right;

							&.colBK {
								color: #000000;
							}
						}
					}
				}
			}
		}
	}
}