@charset 'utf-8';

/**
 * 共通
 */
:root {
	--ii--icon-search: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAUVBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABcqRVCAAAAGnRSTlMASO8I91iAEOSVcECneNfPx4dnXyggGFAwn4LHhdEAAAEKSURBVFjD7ZXLEsIgDEVT2kpLte+X/P+HKhkWUnmEdsaFw1kG7hkTgUIi4UIwiRRDfiI9S4MyMp4zeWSJyZfSQk3P17p3/bubTiJdXL76LN2x1NPyDW7eD0PB4pMkwK3cXp4JeYZ5lzicX9W2BhBLF1NQUJjz+5okaQK+NR7ITz5BTzhO7XvP6FpcCD34tyTBbwSd729c8ZT62dRD4jtI49WjHL7N/svEgoLFeZ25WlmJD0ruaIBBmFzaDVgGCpm0dMGxOACJG25uD/NDshiDLPQDuLc6Tjdk1k+bNpz9uHLUkg0wF0Z8UzWyQSMqPYvBbK2EeP7R8EgGNNySQQkEXDFg/pJBQCJh8AJ0vC71rqR3WwAAAABJRU5ErkJggg==');
	--ii--icon-close: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACLklEQVR4AeyYS07DMBRFCyPYCUPY/yJgxlJgBj4IS1Ga2nXez5IfisnPeffeEztN+3hZ/C8BLD4ALjkCcgQsTiCnwOIDIB+COQVyCixOIKfA4gNA/CnwVAD+lPZSmvfyWgTRxkPZPLdIpgDCX/+yn2XtCYHw70WTBQ94Ybvb9h0kABDe1vOCsA1f9fde6vHuWgLg7aC6NYSj8Ng48sLxbpMA+CjVj4StILTC46XYGV8kAFBD2AOCSXgCSAFQwxqCWXjMawCgjhUE0/AY1wJALW0I5uExrQmAeloQXMJjWBsANaUQ3MJj1gIAdc9CcA2PUSsA1B6F4B4ek5YAqH8vhJDwGLQGgEYPQlh4zHkAQKcFoX6ro19tvF1yTd03W3sBIACBCMZ2q9GHvq0+auc8AWCaYARk+6hxjj5H504d613kDaDn57vXQfu8N4BbD7yay+qrdK1/tfYE0AtfzblC8AJwKzxznlbD17UbBA8ArfA88GhhEKwB9MLXOx4GwRLAveFDIVgBGA0fBsECwNnwIRC0AUjDu0PQBKAV3hWCFgDt8G4QNABYhXeBIAVgHd4cggSAV3hTCBIAEb/ktN4Y/0CN/pMAeN6J8T6Pwd1h9V000NoWftjujGxLAPDjRYWAIYyNaEv6ooUmNU6H52IJAK4HAgYwxL5nQxNtkaYUgEh8hosTwAx3IdJDjoBI+jNo5wiY4S5EesgREEl/Bu0cATPchUgPOQIi6WtoS2v8AgAA//8Qjz4DAAAABklEQVQDAPHgf4ETQhyDAAAAAElFTkSuQmCC');
	--ii--icon-arrow-right: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABABAMAAABYR2ztAAAAGFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABWNxwqAAAAB3RSTlMA7/fn3zDTRYNxUwAAAFFJREFUSMdjGAUDBRgVCCgQL8Ivz1ZeTsAI93ICRrCMGjH8jQgvxwRFhBSUKxBSIEBAQSFeRzKDDMAHzEcNGAkGsBEygEG8kFBBKsAwCgYIAABTrU0dY+acHQAAAABJRU5ErkJggg==');
}



/**
 * 背景のパララックス設定
 */
html, body {
	margin-top: 0 !important;
	height: 100%;
	overflow: hidden !important;
}
#wrapper {
	perspective: 10px;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}
.imut-imut-parallax-background {
	position: absolute;
	inset: 0 0 auto;
	z-index: -1; 
	transform: translateZ(-90px) scale(10);
	opacity: 0.15;
}
.imut-imut-parallax-background .wp-block-group {
	display: flex;
	flex-direction: column;
}
.imut-imut-parallax-background .wp-block-image {
	flex: 1 1 auto;
	width: 100%;
}
.imut-imut-parallax-background img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}


/**
 * ドロワーメニュー
 */
@media (max-width: 768px){
	.drawer-menu {
		width: 100% !important;
		opacity: 0;
		overflow-x: hidden !important;
		transform: translateY(-100%) !important;
		transition: transform 0.6s ease-in-out, opacity 0.6s ease-in !important;
	}
	.drawer-menu.is-active {
		opacity: 1;
		transform: translateY(0) !important;
	}
	.hamburger-close-menu {
		transform: rotate(90deg);
	}
}
@media (min-width: 769px) {
	.drawer-menu {
		left: auto !important;
		width: fit-content !important;
		opacity: 0;
		overflow-x: hidden !important;
		transform: translateX(100%) !important;
		transition: transform 0.6s ease-in-out, opacity 0.6s ease-in !important;
	}
	.drawer-menu.is-active {
		opacity: 1;
		transform: translateX(0) !important;
	}
	.hamburger-close-menu {
		transform: rotate(180deg);
	}
}

.drawer-menu__inner {
	margin-inline: auto;
	width: fit-content;
	min-width: min(100%, 48em);
}

.drawer-menu__nav {
	--_border-color: #666666;
	margin-top: 1em;
	font-size: 16px;
	border-top: 1px solid var(--_border-color);
}
.drawer-menu__nav .menu-item a {
	display: flex !important;
	align-items: center;
	gap: 0.5em;
	padding: 0.5em;
	border-bottom: 1px solid var(--_border-color);
}
.drawer-menu__nav .menu-item a::before {
	content: '';
	display: block;
	width: 1.5em;
	height: 1.5em;
	background: no-repeat center / contain url(../img/logo-imut-imut.png);
}

.drawer-menu__nav .menu-item:nth-last-child(3)::after {
	content: '';
	display: block;
	margin-block: 10px;
	width: 100%;
	height: 16px;
	background: center / 10px url('../img/bg-cross.png');
}
.drawer-menu__nav .menu-item:nth-last-child(2) a {
	border-top: 1px solid var(--_border-color);
}

/**
 * サイトヘッダー
 */
.l-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 100 !important;
}

.header-widget {
	display: flex !important;
	margin-right: 4em !important;
}
.header-widget .wp-block-search {
	display: none !important;
}
.hamburger-menu {
	position: absolute;
	right: 0;
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	padding: 0;
	border: none;
	outline: none;
	border-radius: 0;
	background-color: inherit;
	cursor: pointer;
}
.hamburger-menu-trigger {
	position: relative;
	width: 26px;
	height: 18px;
}
.hamburger-menu-trigger, .hamburger-menu-trigger span {
	display: inline-block;
	box-sizing: border-box;
}
.hamburger-menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	border-radius: var(--ema-border-radius-3);
	background-color: var(--ema-hamburger-menu-color);
}
.hamburger-menu-trigger span:nth-of-type(1) {
	top: 0;
	transition: all 0.3s ease;
}
.hamburger-menu-trigger span:nth-of-type(2) {
	top: 8px;
}
.hamburger-menu-trigger span:nth-of-type(3) {
	bottom: 0;
	transition: all 0.3s ease;
}
.hamburger-menu:hover {
	border: none;
	background-color: inherit;
}
.hamburger-menu:hover .hamburger-menu-trigger span:nth-of-type(1),
.fixed-sidebar-menu:hover .hamburger-menu-trigger span:nth-of-type(1) {
	transform: translateY(2px);
}
.hamburger-menu:hover .hamburger-menu-trigger span:nth-of-type(3),
.fixed-sidebar-menu:hover .hamburger-menu-trigger span:nth-of-type(3) {
	transform: translateY(-2px);
}

.header-menu-inner {
	position: static !important;
	padding-block: 0.5em;
	width: 100% !important;
	max-width: calc(100% - 2em) !important;
/*
	overflow-x: auto !important;
	scrollbar-width: 0.5em !important;
	-ms-overflow-style: 0.5em !important;
*/
}
/*
.header-menu-inner::-webkit-scrollbar{
	height: 0.5em;
}
.header-menu-inner::-webkit-scrollbar-track{
	border-radius: 0.25em;
	box-shadow: inset 0 0 6px rgba(64,64,64,0.1);
}
.header-menu-inner::-webkit-scrollbar-thumb{
	background: rgba(170, 170, 170, 0.5);
	border-radius: 0.25em;
	box-shadow: 0 0 0 1px rgba(192,192,192,0.3);
}
.header-menu-inner::-webkit-scrollbar-thumb:hover{
	background: rgba(170, 170, 170, 0.65);
}
*/

#gnav {
	position: relative;
	display: block !important;
	padding: 0.5em 0;
	background: #ffffff;
	box-shadow: 0 0 2em rgb(0 0 0 / 20%);
}
.imut-imut-header-main-cat-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: min(1em, 2vw);
	padding: 0.5em;
}
.imut-imut-header-cat-link {
	display: block;
	padding: 0.5em min(1.5em, 3vw);
	line-height: 1em;
	background: #DFDFDF;
	border-radius: 0.75em;
	white-space: nowrap;
}
.imut-imut-header-cat-name {
	color: black;
}
.imut-imut-header-cat-name.search {
	display: block;
	width: 1.5em;
	height: 1.5em;
	background: currentColor;
	mask: no-repeat center / contain var(--ii--icon-search);
	overflow: clip;
}
.imut-imut-header-cat-link:has(.imut-imut-header-cat-name.search) {
	padding: 0.25em 0.75em;
}
@media (min-width: 769px) {   /* PC, Tablet */
	.imut-imut-header-child-cat-container {
		position: absolute;
		inset: auto 0 0;
		background: #666666;
		opacity: 0;
		visibility: hidden;
		transform: translateY(100%);
		transition: 0.6s;
	}
	.imut-imut-header-child-parent-cat-name,
	.imut-imut-header-child-modal-close {
		display: none !important;
	}
}
@media (max-width: 768px) {   /* SP */
	.imut-imut-header-child-cat-container {
		position: absolute;
		inset: auto 5% 0;
		z-index: 9999;
		margin: auto;
		padding: 2em;
		height: fit-content;
		max-height: calc((100dvh - 90px) * 0.8);
		background: #ffffff;
		border-radius: 0.5em;
		box-shadow: 0.5em 1em 3em rgb(0 0 0 / 30%);
		overflow-x: clip;
		overflow-y: auto;
		opacity: 0;
		visibility: hidden;
		transform: translateY(100%) translateY(calc((100dvh - 90px) * 0.1));
		transition: 0.6s;
	}
	.imut-imut-header-child-parent-cat-name {
		margin-top: 0 !important;
	}
	.imut-imut-header-child-modal-close {
		display: flex;
		align-items: center;
		gap: 0.5em;
		margin: 4em auto 0;
		padding: 0.5em 1.5em;
		line-height: 1em;
		color: #ffffff;
		background: #666666;
		border: none;
		border-radius: 9999em;
	}
	.imut-imut-header-child-modal-close::before {
		content: '';
		display: block;
		width: 1em;
		height: 1em;
		background: currentColor;
		mask: no-repeat center / contain var(--ii--icon-close);
	}
	/* 背景の暗転用 */
	header:has(.imut-imut-header-child-cat-container.is-active) ~ #contents {
		position: relative;
	}
	header:has(.imut-imut-header-child-cat-container.is-active)::after,
	header:has(.imut-imut-header-child-cat-container.is-active) ~ #contents::after {
		content: '';
		position: absolute;
		inset: 0;
		z-index: 99;
		background: rgb(0 0 0 / 60%);
	}
}
.imut-imut-header-child-cat-container.is-active {
	opacity: 1;
	visibility: visible;
}
.imut-imut-header-child-cat-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0.5em 1em;
	padding: 0.5em;
	min-height: 4em;
}
.imut-imut-header-child-cat-container .wp-block-search {
	margin: 1em auto;
	width: 90%;
	max-width: 480px;
}
/*
.header-menu {
	justify-content: center;
	gap: 1em;
	min-width: max-content;
}
.header-menu .menu-item {
	flex: 0 0 auto !important;
	white-space: nowrap;
}
.header-menu .menu-item > a {
	display: flex;
	flex-direction: row !important;
	justify-content: center;
	align-items: center;
	gap: 0.5em;
	padding: 0.5em 1.5em !important;
	height: auto !important;
	background: white;
	border-radius: 0.75em;
}
.header-menu .menu-item > a::before {
	content: '';
	display: block;
	width: 1.5em;
	height: 1.5em;
	background: no-repeat center / contain url(../img/logo-imut-imut.png);
}
*/


/**
 * コンテンツ
 */
body {
	font-size: clamp(12px, 1.1vw, 16px) !important;
}

@media (min-width: 1200px) {
	.home .is-no_sidebar .l-content__main,
	.home.page .is-no_sidebar .l-content__main {
		width: 100% !important;
	}
}

@media screen and (min-width: 1300px) {
	.l-content,
	.home.align-wide-layout .alignwide,
	.front-page-widget .alignwide,
	.front-page-widget-inner {
		left: auto !important;
		width: 1280px !important;
	}
}

.l-contents {
	margin-top: 0 !important;
	padding-top: 2em !important;
}
.home .l-contents {
	padding-top: 0 !important;
}
.home .article-body {
	padding-top: 0 !important;
}

.imut-imut-product-list .wp-block-post-template {
	--_grid-columns: 4;
	display: grid;
	grid-template-columns: repeat(var(--_grid-columns), 1fr);
	gap: 1em 2em;
}
.imut-imut-product-list .wp-block-post-template > * {
	margin-block-start: 0 !important;
}
.imut-imut-product-list .imut-imut-product-list-price {
	align-items: baseline;
	font-weight: bold;
	color: #bf0000;
}
.imut-imut-product-list .imut-imut-product-list-price .price {
	font-size: 28px;   /* 楽天準拠 */
}
.imut-imut-product-list .imut-imut-product-list-price .unit {
	font-size: 16px;   /* 楽天準拠 */
}

@media (max-width: 768px) {
	.imut-imut-product-list .wp-block-post-template {
		--_grid-columns: 2;
	}
}

.imut-imut-heading {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.5em;
	margin-block: 2em;
	padding-block: 1em;
	font-size: 1.5em;
	border-top: 1px solid #b2b2b2;
	border-bottom: 1px solid #b2b2b2;
	background: none !important;   /* エディタ用 */
	border-left: none !important;   /* エディタ用 */
}
.imut-imut-heading::before {
	content: '';
	display: block;
	width: 2em;
	height: 2em;
	background: no-repeat center / contain url(../img/logo-imut-imut.png);
}
@media (max-width: 768px) {
	.imut-imut-heading {
		margin-block: 1.5em;
		padding-block: 0.5em;
	}
}

.wp-block-group:has(> .imut-imut-topics-container) {
	margin-top: 1em !important;
}
.is-layout-constrained > .imut-imut-topics-container {
	margin-inline: calc(50% - 50vw) !important;
	max-width: none !important;
}
.imut-imut-topics-wrapper {
	padding-bottom: 40px;
}
.imut-imut-topics-link {
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	color: inherit;
	line-height: 1.2;
}
.imut-imut-topics-featured-image {
	margin-bottom: 0;
	border-radius: 0.75em;
	overflow: hidden;
}
.imut-imut-topics-img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform 0.3s ease;
}
.imut-imut-topics-link:hover .imut-imut-topics-img {
	transform: scale(1.1);
}
.imut-imut-topics-title {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.splide .splide__pagination__page.is-active {
	background: #ff0000 !important;
}

.imut-imut-arrow-right > .wp-block-button__link {
	display: flex;
	gap: 1em;
}
.imut-imut-arrow-right > .wp-block-button__link::after {
	content: '';
	display: inline-block;
	width: 1.5em;
	height: 1.5em;
	background: currentColor;
	mask: no-repeat center / contain var(--ii--icon-arrow-right);
}


/**
 * アーカイブ
 */
.imut-imut-front-page-list-title > a,
.imut-imut-archive-name {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}


/**
 * コンテンツ内の画像
 */
#contents img,
.imut-imut-ig-feed .ig-post {
	border-radius: 0.75em;
}


/**
 * フッター
 */
.l-footer {
	color: inherit !important;
	background: #ffffff !important;
}
.l-footer .copyright {
	padding: 0 !important;
}
.l-footer .copyright a {
	color: inherit !important;
}

.imut-imut-footer-buttons > .wp-block-button {
	flex: 0 1 15em;
	width: 15em !important;
}
.imut-imut-footer-buttons > .wp-block-button > .wp-block-button__link {
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 3 / 2;
	padding: 2em;
	color: black;
	background: #d9d9d9;
	border-radius: 0.75em;
}

@media (max-width: 480px) {
	.imut-imut-footer-widget-banner > .wp-block-cover {
		--wp--preset--font-size--ema-s-1: 0.75rem;
		flex-basis: calc((100% - var(--wp--preset--spacing--40)) / 2);
	}
}