@charset "utf-8";



/* --------------------------------------------------------------------------------
misc
-------------------------------------------------------------------------------- */

br.large {
	display: none;
}
br.small {
	display: inline;
}
img.large {
	display: none;
}
img.small {
	display: block;
}
span.no-large,
i.no-large,
em.no-large {
	display: inline;
}
span.no-small,
i.no-small,
em.no-small {
	display: none;
}



/* --------------------------------------------------------------------------------
page
-------------------------------------------------------------------------------- */

p#button-shop {
	pointer-events: none;
	opacity: 0;
	transition: 0.25s opacity ease;
}
div.scroll p#button-shop {
	opacity: 1;
}
p#button-shop a {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 40px;
}
p#button-shop span {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
p#button-shop i.icon {
	margin: 0px 5px 0px 0px;
	transform: translateY(-2px);
}


/* --------------------------------------------------------------------------------
header
-------------------------------------------------------------------------------- */

body.admin-bar header#header p#logo,
body.admin-bar header#header p#button-menu,
body.admin-bar header#header div#menu {
	top: 0px;
}
header#header p#logo {
	height: 60px;
}
header#header p#logo img {
	height: 50px;
}
header#header p#button-menu {
	width: 60px;
	height: 60px;
}
header#header div#menu {
	width: 100%;
}
body.admin-bar header#header div#menu {
	height: 100%;
}
header#header div#menu div.inner-menu {
	padding-top: 10px;
}
header#header div#menu p.logo img {
	height: 40px;
	opacity: 1;
}
header#header nav#navi-product {
	top: 60px;
}
body.admin-bar header#header nav#navi-product {
	top: 60px;
}
header#header nav#navi-product div.background {
	position: fixed;
	top: 100px;
}
header#header nav#navi-product div.list {
	width: 100%;
	height: 40px;
	padding-right: 60px;
}
header#header nav#navi-product div.list div.row {
	width: 33.33%;
}
header#header nav#navi-product div.list div.row:hover::before {
	opacity: 0;
	transform: scaleX(0);
}
header#header nav#navi-product div.list div.row.open::before {
	opacity: 1;
	transform: scaleX(1);
}
header#header nav#navi-product div.list div.row p.headline {
	line-height: 1rem;
	padding-top: 5px;
}
header#header nav#navi-product div.list div.row p.headline span {
	display: block;
}
header#header nav#navi-product div.list div.row p.headline span.main {
	font-size: 0.875rem;
}
header#header nav#navi-product div.list div.row p.headline span.sub {
	font-size: 0.625rem;
}
header#header nav#navi-product div.list div.row div.nest {
	position: fixed;
	width: 100%;
	top: 102px;
	overflow: hidden;
	transition: 0.25s height ease;
}
header#header nav#navi-product div.list div.row div.nest::-webkit-scrollbar {
  display: none;
}
header#header nav#navi-product div.list div.row.open div.nest {
	height: calc(100% - 102px);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest {
	width: 100%;
}
header#header nav#navi-product div.list div.row.open div.nest div.background-nest {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
header#header nav#navi-product div.list div.row div.nest div.inner-nest {
	position: relative;
	padding: 20px 40px;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest {
	display: block;
	margin-right: 0px;
	padding: 0px !important;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: auto;
	margin-right: 0px;
	justify-content: space-around;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:nth-child(2){
	width: 100%;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:not(:last-child) {
	margin-bottom: 40px;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:not(:last-child)::before {
	position: absolute;
	width: calc(100% + 80px);
	width: calc(100% + 65px);
	height: 0px;
	left: -40px;
	bottom: -20px;
	border-bottom: 1px solid #aca76e;
	content: "";
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:nth-child(4) {
	width: auto;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest p.headline-nest {
	width: 200px;
	/* width: 130px; */
	border-bottom: none;
	margin-bottom: 0px;
	padding-bottom: 0px;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest p.headline-nest span.main {
	font-size: 1rem;
	line-height: 1rem;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest p.headline-nest span.sub {
	font-size: 0.625rem;
	line-height: 0.875rem;
}
header#header nav#navi-product div.list div.row:nth-child(1) div.nest ul {
	width: calc(100% - 210px);
	/* width: calc(100% - 150px); */
}
header#header nav#navi-product div.list div.row div.nest ul.no-headline {
	position: relative;
	width: 100%;
	border-top: none;
	margin-top: 40px;
	padding: 0px 0px 0px 165px;
}
header#header nav#navi-product div.list div.row div.nest ul.no-headline::before {
	position: absolute;
	width: calc(100% + 80px);
	height: 0px;
	left: -40px;
	top: -20px;
	border-top: 1px solid #aca76e;
	content: "";
}
header#header nav#navi-product div.list div.row div.nest p.button-close,
header#header nav#navi-product div.search p.button-close {
	position: relative;
	width: 30px;
	height: 30px;
	cursor: pointer;
	margin: 20px auto 0px auto;
}
header#header nav#navi-product div.list div.row div.nest p.button-close::before,
header#header nav#navi-product div.list div.row div.nest p.button-close::after,
header#header nav#navi-product div.search p.button-close::before,
header#header nav#navi-product div.search p.button-close::after {
	position: absolute;
	width: 30px;
	height: 0px;
  left: calc(50% - 15px);
	top: calc(50% - 0.5px);
	border-bottom: 1px solid #504946;
	content: "";
}
header#header nav#navi-product div.list div.row div.nest p.button-close::before,
header#header nav#navi-product div.search p.button-close::before {
	transform: rotate(45deg);
}
header#header nav#navi-product div.list div.row div.nest p.button-close::after,
header#header nav#navi-product div.search p.button-close::after {
	transform: rotate(-45deg);
}
	header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:nth-child(4) ul + p,
	header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:nth-child(4) ul + p + ul {
		display: none;
	}
@media screen and (640px < width) {
	header#header nav#navi-product div.list div.row div.nest div.list-nest div.row-nest p.headline-nest{
		width:240px !important;
	}
	header#header nav#navi-product div.list div.row div.nest div.list-nest div.row-nest ul{
		width: calc(100% - 250px);
	}
}
@media screen and (width < 640px) {
	header#header nav#navi-product div.list div.row:nth-child(1) div.nest div.list-nest div.row-nest:nth-child(4) p br {
		display: inline;
	}
}
@media screen and (width < 420px) {
	header#header nav#navi-product div.list div.row div.nest div.list-nest div.row-nest{
		flex-direction:column;
	}
	header#header nav#navi-product div.list div.row div.nest div.list-nest div.row-nest p.headline-nest{
		margin-bottom: .6rem !important;
		width: 100% !important;
	}
	header#header nav#navi-product div.list div.row div.nest div.list-nest div.row-nest ul{
		width:100%;
	}
}
header#header nav#navi-product div.list div.row div.nest div.inner-nest {
	position: relative;
	padding: 20px 40px;
}

header#header nav#navi-product div.search {
	position: absolute;
	width: auto;
	height: 40px;
	right: 0px;
	top: 0px;
}
header#header nav#navi-product div.search p.button-search {
	display: block;
	position: absolute;
	right: 20px;
	top: 5px;
	font-size: 1.25rem;
	color: #aca76e;
}
header#header nav#navi-product div.search form {
	position: fixed;
	width: 100%;
	height: 0px;
	left: 0px;
	top: 102px;
	overflow: hidden;
	transition: 0.25s height ease;
}
header#header nav#navi-product div.search.open form {
	height: calc(100% - 102px);
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
header#header nav#navi-product div.search.open form div.background-form {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
header#header nav#navi-product div.search form div.inner-form {
	position: relative;
	padding: 40px 40px 20px 40px;
	background-color: #f3f2ea;
}
header#header nav#navi-product div.search form div.inner-form::before {
	display: block;
	font-family: yu-gothic-pr6n, sans-serif;
	font-size: 0.875rem;
	content: "キーワード検索";
}
header#header nav#navi-product div.search form input[type=text] {
	width: 100%;
}
header#header nav#navi-product div.search form button {
	right: 40px;
	top: 70px;
}
header#header > div.shop {
	right: 15px;
	top: 15px;
	transition: 0.25s opacity ease-in-out;
}
body.menu-header header#header > div.shop {
	pointer-events: none;
	opacity: 0;
}
body.admin-bar header#header > div.shop {
	top: 15px;
}
header#header > div.shop ul li {
	font-size: 1.5rem;
}
header#header > div.shop ul li:not(:last-child) {
	margin-right: 10px;
}



/* --------------------------------------------------------------------------------
cover
-------------------------------------------------------------------------------- */

div#cover {
	height: calc(100svh - 74px);
	top: 0;
}
div#cover h1 {
	/* max-width: 480px; */
	width: 100%;
	left: 0;
	right: 0;
	margin-inline:auto;
	height: auto;
	top: auto;
	/* bottom:25svw; */
}
div#cover h1 span {
	padding-top: 15px;
}
div#cover p.button-scroll {
	left: calc(50% - 10px);
	bottom: 30px;
	display: block;
	display: none;
}



/* --------------------------------------------------------------------------------
main
-------------------------------------------------------------------------------- */
main{
	padding-top: 60px;
}

main nav.fs-c-breadcrumb {
	padding: 10px 20px 0px 20px;
}
main section div.inner-section {
	width: auto;
	padding: 80px 20px;
}
main section:nth-of-type(1) div.inner-section {
	padding-top: 60px;
	padding-top: 120px;
}
main section header {
	margin-bottom: 60px;
}
main div#pager {
	margin-top: 40px;
}

/* home
-------------------------------------------------------------------------------- */
body.fs-body-top.menu-header header#header > #logo img,
body.fs-body-top.menu-header header#header > div.shop{
	opacity: 0 !important;
	pointer-events: none;
}
.fs-body-top div#page{
	padding-top: 74px;
}
#head-family{
	height: 74px;
	width: auto;
}
#head-family a .welcome{
	font-size: 11px;
	line-height: 1.4;
	text-align: center;
}
#head-family a .jmmfamily-logo{
	padding-inline:10px 11px;
}
#head-family a .jmmfamily-logo img{
	width: 134px;
	height: auto;
}
#head-family a .register{
	width: auto;
	font-size: 10px;
	padding-inline:10px;
	height: 28px;
}
@media screen and (width < 375px) {
	#head-family a{
		padding-inline:5px;
	}
	#head-family a .welcome{
		letter-spacing: 0;
	}
	#head-family a .jmmfamily-logo{
		padding-inline:8px;
	}
	#head-family a .register{
		padding-inline: 5px;
		line-height: 1.4;
		letter-spacing: 0;
	}
}

main section#home-information div.inner-section {
	width: auto;
}
main section#home-brand div.inner-section{
	padding-top: 90px;
}
main section#home-brand p.description {
	width: auto;
}

main section#home-cacao{
	margin-block: 100px 60px;
}
main section#home-cacao div.inner-section{
	background: url(https://jmmchocolate.itembox.design/item/images/2025/home-illust-1.png?v2) no-repeat 90% top / 115px;
	padding-top: 260px;
}
main section#home-cacao header h2{
	font-size: 1.8rem;
	line-height: 2.6rem;
	margin-bottom:30px ;
}
main section#home-cacao header h3{
	background: url(https://jmmchocolate.itembox.design/item/images/2026/home-cacao-small.png?aaa) no-repeat center center / cover;
	margin-inline: -20px;
	margin-bottom: 25px;
}
main section#home-cacao header h3 img.small{
	width: 400px;
	text-align: center;
	display: inline-block;
}

main section header h2 {
	font-size:1.25rem;
}
main section#home-collection .content p.button-onlineshop{
	margin-block:0 60px;
}
main section#home-collection div.list {
	display: block;
	margin: 0px -20px;
}
main section#home-collection div.list div.row {
	width: auto;
	margin: 0px;
}
main section#home-collection div.list div.row:not(:last-child) {
	margin-bottom: 80px;
}
main section#home-collection div.list div.row p.image {
	aspect-ratio: 1;
}
main section#home-collection div.list div.row p.image img {
	object-fit: cover;
	height: 100%;
	width: calc(100% - 30px);
	margin-inline: auto;
}
main section#home-collection div.list div.row p.description{
	height: auto;
}
main section#home-collection div.list div.row p.description span {
	display: inline;
	padding-bottom: 0;
}
main section#home-news div.inner-section {
	width: auto;
}
body.home main div.banner-shop-list,
body.fs-body-top main div.banner-shop-list {
	margin-bottom: 80px;
}
main section#home-news div.inner-section{
	padding-bottom: 65px;
}
main section#home-theme div.inner-section{
	background: none;
	padding-top: 0;
}
main section#home-theme div.inner-section header{
	background: url(https://jmmchocolate.itembox.design/item/images/2025/home-illust-1.png?v2) no-repeat calc(50% + 105px) top / 90px;
	padding-top: 135px;
}
main section#home-theme div.inner-section header h3{
	margin-top: 30px;
}
body.fs-body-top main section.banner-shop-list{
	margin-top: 70px;
}
body.fs-body-top main section.banner-shop-list div.inner-section {
	/* background: none; */
	padding-block: 262px 0;
	background-size: 223px;
	background-position: calc(50% - 45px) 15px;
}
main section#home-collection div.list div.row h3{
	padding-inline: 1rem;
}

/* news
-------------------------------------------------------------------------------- */

main section#news div.inner-section {
	width: auto;
}
main div.list-news div.row {
	padding: 20px 0px;
}
main div.list-news div.row p.created {
	width: 100px;
}
main div.list-news div.row h3 {
	width: calc(100% - 100px);
}

/* product
-------------------------------------------------------------------------------- */
body.fs-body-product main, body.fs-body-category main, body.fs-body-search main{
	padding-top: 100px;
}
main div.fs-c-productList,
main div.fs-l-productLayout,
main section#recommend,
main nav#navi-product-alternate {
	width: auto;
	padding-top: 80px;
}
main div.fs-c-productList,
main div.fs-l-productLayout {
	padding-left: 20px;
	padding-right: 20px;
}
main div.fs-c-productList div.fs-c-productList__list {
	margin: 0px -20px -40px 0px;
}
main div.fs-c-productList div.fs-c-productList__list article {
	width: calc(50% - 20px);
	margin: 0px 20px 40px 0px;
}
main div.fs-c-productList div.fs-c-productList__list article h2 span.fs-c-productName__copy,
main div.fs-c-productList div.fs-c-productList__list article h2 span.fs-c-productName__name {
	line-height: 1.5rem;
}
main div.fs-c-productList div.fs-c-productList__list article h2 span.fs-c-productName__copy {
	font-size: 1rem;
}
main div.fs-c-productList div.fs-c-productList__list article h2 span.fs-c-productName__name {
	font-size: 0.875rem;
}
main div.fs-c-productList div.fs-c-productList__list article div.fs-c-productListItem__control a {
	width: 100px;
}
main div.fs-c-productList div.fs-c-productList__list article div.fs-c-productListItem__control button.fs-c-button--particular {
	left: calc(50% + 60px);
}
main section#item-detail-head {
	display: block;
	margin-bottom: 80px;
}
main section#item-detail-head div#item-detail-images {
	width: auto;
	margin-bottom: 40px;
}
main section#item-detail-head div#item-detail-info {
	width: auto;
}
main section#item-detail-head div#item-detail-info h1 {
	text-align: center;
}
main section#item-detail-head div#item-detail-info div.fs-c-productMarks ul {
	justify-content: center;
}
main section#item-detail-head div#item-detail-info div.fs-c-productPrices,
main section#item-detail-head div#item-detail-info div.fs-c-productPointDisplay {
	justify-content: center;
}
main section#item-detail-head div#item-detail-info div.fs-c-productPointDisplay {
	margin-bottom: 10px;
}
main section#item-detail-head div#item-detail-info div.fs-c-productSalesPeriod {
	text-align: center;
	line-height: 1.5rem;
}
main section#item-detail-head div#item-detail-info div.fs-c-productSalesPeriod span.fs-c-productSalesPeriod__label {
	display: block;
}
main section#item-detail-head div#item-detail-info dl.fs-c-productSelection {
	margin: auto;
}
main section#item-detail-head div#item-detail-info div.fs-c-productQuantityAndWishlist {
	width: 260px;
	margin: 0px auto 20px auto;
}
main section#item-detail-head div#item-detail-info div.fs-c-productQuantityAndWishlist span.fs-c-productQuantityAndWishlist__wishlist {
	left: auto;
	right: -30px;
}
main section#item-detail-head div#item-detail-info div.fs-c-productActionButton button {
	display: block;
	margin: 0px auto 10px auto;
}
main section#item-detail-head div#item-detail-info div.fs-c-productActionButton p.delivery {
	margin: auto;
}
main section#item-detail-body {
	display: block;
}
main section#item-detail-body div#item-detail-bonbon {
	width: auto;
}
main section#item-detail-body div#item-detail-bonbon p.notice i.icon {
	display: inline-block;
	font-size: 1.875rem;
	color: #aca76e;
	margin-right: 5px;
	transform: translateY(6px);
}
main section#item-detail-body > div:not(#item-detail-bonbon) {
	width: auto;
}
main section#item-detail-body div#container-assort {
	margin-bottom: 40px;
}
main section#recommend {
	margin-bottom: 80px;
	padding-left: 20px;
	padding-right: 20px;
}
main section#recommend div.fs-c-productListCarousel__list__itemTrack {
	margin: 0px -20px -40px 0px;
}
main section#recommend div.fs-c-productListCarousel__list__itemTrack article {
	width: calc(50% - 20px);
	margin: 0px 20px 40px 0px;
}
main nav#navi-product-alternate {
	display: none;
}
main section#product div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#product div.block::before {
	width: 100%;
}
main section#product div.block:nth-child(2n+1)::before {
	right: 0px;
}
main section#product div.block:nth-child(2n)::before {
	left: 0px;
}
main section#product div.block div.image-text {
	display: block;
	margin-bottom: 40px;
}
main section#product div.block:nth-child(2n+1) div.image-text {
	padding-right: 0px;
}
main section#product div.block:nth-child(2n) div.image-text {
	padding-left: 0px;
}
main section#product div.block div.image-text p.image {
	width: auto;
	margin: 0px -20px 40px -20px;
}
main section#product div.block div.image-text div.text {
	width: auto;
}
main section#product div.block div.image-text div.text h2 {
	font-size: 2.25rem;
	line-height: 2.75rem;
}
main section#product div.block div.image-text div.text p.sub,
main section#product div.block div.image-text div.text p.headline {
	margin-bottom: 20px;
}
main section#product div.block p.label {
	width: auto;
}
main section#product div.block:nth-child(2n+1) p.label {
	margin: 0px;
}
main section#product div.block:nth-child(2n) p.label {
	margin: 0px;
}
main section#product div.block div.collapse div.inner-collapse {
	padding: 20px 0px;
}
main section#product div.block div.fs-c-productList {
	padding: 0px 0px 40px 0px;
}

/* chocolat
-------------------------------------------------------------------------------- */

main div.list-chocolat {
	display: block;
	margin: 0px;
}
main div.list-chocolat div.row {
	width: auto;
	margin: 0px;
}
main div.list-chocolat div.row:not(:last-child) {
	border-bottom: 2px dotted #aba775;
	margin-bottom: 40px;
	padding-bottom: 40px;
}
main div.list-chocolat div.row div.header {
	display: block;
	text-align: center;
	margin-bottom: 10px;
}
main div.list-chocolat div.row div.header h3 {
	font-family: ariana-pro, sans-serif;
	font-size: 1.25rem;
	color: #aca76e;
	margin-bottom: 5px;
}
main div.list-chocolat div.row-liqueur div.header h3::after {
	font-family: "icon";
	font-size: 1rem;
	margin-left: 5px;
	content: "\e911";
	transform: translateY(1px);
}
main div.list-chocolat div.row div.header p.sub {
	font-size: 0.875rem;
	line-height: 1.25rem;
}
main div.list-chocolat div.row div.image-text-row p.image span.new {
	left: 0px;
}
main div.list-chocolat div.row div.image-text-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}
main div.list-chocolat div.row div.image-text-row p.image {
	width: 100px;
	padding: 20px 0px 35px 0px;
}
main div.list-chocolat div.row div.image-text-row p.image span.feature {
	width: 100%;
	height: calc(42px * 0.875);
	left: 0px;
	right: auto;
	top: auto;
	bottom: 0px;
}
main div.list-chocolat div.row div.image-text-row div.text-row {
	width: calc(100% - 110px);
	padding-top: 20px;
}
main div.list-chocolat div.row div.image-text-row div.text-row div.header-alternate {
	display: none;
}
main div.list-chocolat div.row div.image-text-row div.text-row p.cacao {
	text-align: justify;
}
main div.list-chocolat div.row div.image-text-row div.text-row p.product a {
	width: 100%;
}
main div.list-chocolat div.row div.image-text-row div.text-row p.product a::before,
main div.list-chocolat div.row div.image-text-row div.text-row p.product a::after {
	left: 30px;
	right: auto;
}
main div.list-chocolat div.row div.image-text-row div.text-row p.product a::after {
	transform-origin: right bottom;
	transform: rotate(45deg);
}
main div.list-chocolat-alternate {
	margin: 0px -20px -20px 0px;
}
main div.list-chocolat-alternate div.row {
	width: calc(50% - 20px);
	margin: 0px 20px 20px 0px;
}
main div.list-chocolat-alternate div.row div.image-text-row p.image {
	width: 120px;
	margin: auto;
	padding-top: 50px;
}
main div.list-chocolat-alternate div.row div.image-text-row p.image span.feature {
	height: calc(42px * 0.875);
}
main section#chocolat div.inner-section {
	width: auto;
}
main section#chocolat div.block:not(:last-child) {
	margin-bottom: 60px;
}
main section#chocolat div.block div.image-text {
	display: block;
	position: relative;
	margin-right: -20px;
}
main section#chocolat div.block div.image-text div.text {
	width: auto;
}
main section#chocolat div.block div.image-text div.text p.description {
	position: relative;
	width: auto;
	z-index: 1;
	text-align: left;
}
main section#chocolat div.block div.image-text p.image {
	width: 160px;
	margin: -60px 0px 20px auto;
}
main section#chocolat div.block p.label {
	justify-content: center;
	text-align: center;
	padding: 0px 40px;
}
main section#chocolat div.block div.collapse div.inner-collapse {
	padding: 20px 0px;
}

/* 2025~ */
body.bonbon-chocolate main div.list-chocolat-alternate {
	margin: 0px -20px -20px 0px;
}
body.bonbon-chocolate main div.list-chocolat-alternate div.row{
	width: calc(50% - 20px);
	margin: 0px 20px 20px 0px;
}
@media screen and ( 640px < width) {
	body.bonbon-chocolate main div.list-chocolat-alternate div.row{
		width: calc(33% - 20px);
	}
}
@media screen and ( 860px < width) {
	body.bonbon-chocolate main div.list-chocolat-alternate div.row{
		width: calc(25% - 20px);
	}
}

/* brand
-------------------------------------------------------------------------------- */

main div#brand-title {
	height: 60px;
}
main section#brand header h1 {
	margin-bottom: 40px;
}
main section#brand header nav#navi-sub ul {
	width: auto;
}
main section#brand header nav#navi-sub ul li {
	width: 50%;
}
main section#brand div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#brand div.block div.header,
main section#brand div.block div.header p.image {
	margin-bottom: 40px;
}
main section#brand div.block div.header p.image {
	margin-left: -20px;
	margin-right: -20px;
}
main section#brand div.block div.list {
	width: auto;
}
main section#brand div.block div.list div.row {
	display: block;
}
main section#brand div.block div.list div.row div.text {
	width: auto;
	margin-bottom: 40px;
}
main section#brand div.block div.list div.row-header div.text {
	width: 100%;
}
main section#brand div.block div.list div.row div.text h3 {
	text-align: center;
}
main section#brand div.block div.list div.row p.image {
	width: 250px;
	margin: auto;
	padding-top: 0px;
}
main section#cacao header {
	margin-left: -20px;
	margin-right: -20px;
	padding: 0px 20px 220px 20px;
	background-size: auto 300px;
	background-position: 25% bottom;
}
main section#cacao {
	background:none;
}
main section#cacao header.header-2025 {
	margin-left: -20px;
	margin-right: -20px;
	padding: 0px 20px 200px 20px;
	background: url(https://jmmchocolate.itembox.design/item/images/2025/brand-cacao-background.svg) no-repeat 50% bottom;
	background-size: auto 332px;
}
main section#cacao header p.description,
main section#material header p.description,
main section#tasting header p.description {
	width: auto;
	margin-inline: 20px;
}
main section#cacao div.list {
	display: block;
	margin: -40px 0px 0px 0px;
}
main section#cacao div.list div.row {
	width: auto;
	margin: 0px;
	padding: 20px;
}
main section#cacao div.list div.row:not(:last-child) {
	margin-bottom: 60px;
}
main section#cacao div.list div.row p.image {
	width: auto;
}
main section#material div.inner-section {
	width: auto;
}
main section#material div.list div.row {
	display: block;
}
main section#material div.list div.row:not(:last-child) {
	margin-bottom: 60px;
}
main section#cacao div.list div.row::before {
	background-position: center 14px;
	background-size: auto 42px;
}
main section#cacao div.list div.row.new::before {
	background-position: center 8px;
	background-size: auto 55px;
}
main section#material div.list div.row p.image {
	margin: 0px auto 20px auto;
}
main section#material div.list div.row div.text {
	width: auto;
}
main section#material div.list div.row div.text h2,
main section#material div.list div.row div.text p.sub,
main section#material div.list div.row div.text h3 {
	text-align: center;
}
main section#material div.list div.row div.text h2 {
	text-indent: 0.075em;
}
main section#tasting div.inner-section {
	width: auto;
}
main section#tasting div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#tasting div.block-notice div.list div.row:not(:first-child) {
	margin-top: 0px;
}
main section#tasting div.block-notice div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#tasting div.block-notice div.list div.row div.illust-description {
	justify-content: space-between;
}
main section#tasting div.block-notice div.list div.row div.illust-description p.description {
	width: calc(100% - 180px);
	margin-right: 0px;
}
main section#tasting div.block-notice div.list div.row div.illust-description p.illust {
	transform: translateY(5px);
}
main section#tasting div.block-order p.summary {
	text-align: justify;
}
main section#tasting div.block-order div.list {
	display: block;
	margin-bottom: 0px;
}
main section#tasting div.block-order div.list div.row {
	width: auto;
	margin-bottom: 0px;
}
main section#tasting div.block-order div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#archives div.inner-section {
	padding-top: 60px;
}
main section#archives header h1,
main section#archives header nav#navi-sub {
	margin-bottom: 40px;
}
main section#archives header nav#navi-sub ul {
	width: auto;
	margin-left: 15px;
	margin-right: 15px;
}
main section#archives header nav#navi-sub ul li {
	width: 14.28%;
	font-size: 1.25rem;
	line-height: 1.2;
}
@media screen and ( 568px > width) {
	main section#archives header nav#navi-sub ul{
		justify-content: flex-start;
	}
	main section#archives header nav#navi-sub ul li {
		width: 25%;
	}
}
@media screen and ( width < 414px) {
	main section#archives header nav#navi-sub ul {
		margin-inline: 5px;
	}
	main section#archives header nav#navi-sub ul li a {
		padding-inline:0;
	}
}
@media screen and ( width < 340px) {
	main section#archives header nav#navi-sub ul {
		margin-inline: 10px;
	}
	main section#archives header nav#navi-sub ul li {
		width: 33.333%;
	}
	main section#archives header nav#navi-sub ul li a {
		padding-block: 7px;
	}
}
main section#archives div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#archives div.block div.header {
	margin-bottom: 40px;
}
main section#archives div.block div.header p.description {
	text-align: justify;
}
main section#archives div.block p.image {
	margin-bottom: 40px;
}
main section#archives div#archives-2024 p.image {
	max-width: calc(580px * 0.75);
	max-height: calc(412px * 0.75);
	width:80svw;
	height:56.8svw;
}
main section#archives div#archives-2023 p.image,
main section#archives div#archives-2022 p.image {
	width: calc(304px * 0.75);
	height: calc(427px * 0.75);
}
main section#archives div#archives-2021 h3 img {
	height: calc(115px * 0.75);
}
main section#archives div#archives-2021 div.list p.row {
	width: 33.33%;
}
main section#archives div#archives-2020 p.image {
	width: calc(331px * 0.75);
	height: calc(331px * 0.75);
}
main section#archives div#archives-2019 p.image {
	width: calc(404px * 0.75);
	height: calc(245px * 0.75);
}
main nav#navi-brand {
	width: auto;
	padding: 0px 20px 80px 20px;
}
main nav#navi-brand div.list {
	display: block;
	margin: 0px 0px 60px 0px;
}
main nav#navi-brand div.list div.row {
	width: auto;
	margin: 0px;
}
main nav#navi-brand div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}

/* shop-list
-------------------------------------------------------------------------------- */

main section#shop-list div.inner-section {
	width: auto;
	padding-left: 0px;
}
main section#shop-list div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#shop-list div.block div.list div.row {
	display: block;
}
main section#shop-list div.block div.list div.row p.shop {
	width: auto;
	margin-bottom: 10px;
}
main section#shop-list div.block div.list div.row p.date {
	width: auto;
}

/* recruitment
-------------------------------------------------------------------------------- */

main section#recruitment div.inner-section {
	width: auto;
}
main section#recruitment div.block {
	padding: 0px 0px 0px 20px;
}
main section#recruitment div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#recruitment div.block div.image {
	display: block;
	margin-bottom: 60px;
}
main section#recruitment div.block div.image p.row {
	width: auto;
}
main section#recruitment div.block div.image p.row:not(:last-child) {
	margin-bottom: 10px;
}
main section#recruitment div.block div.list {
	margin-bottom: 60px;
}
main section#recruitment div.block div.contact {
	width: auto;
}

/* shopping-guide
-------------------------------------------------------------------------------- */

main section#shopping-guide div.inner-section,
main section#faq div.inner-section,
main section#law div.inner-section {
	width: auto;
}
main section#shopping-guide div.block:not(:last-child),
main section#faq div.block:not(:last-child),
main section#law div.block:not(:last-child) {
	margin-bottom: 80px;
}
main section#shopping-guide div.block-flow div.list div.row {
	min-height: 0px;
	border-left: none;
	padding: 0px 0px 0px 20px;
}
main section#shopping-guide div.block-flow div.list div.row:not(:last-child) {
	margin-bottom: 60px;
}
main section#shopping-guide div.block-flow div.list div.row div.text {
	position: relative;
	margin-bottom: 20px;
	padding: 10px 0px;
}
main section#shopping-guide div.block-flow div.list div.row div.text::before {
	position: absolute;
	width: 0px;
	height: 100%;
	left: -40px;
	top: 0px;
	border-left: 10px solid #aca76e;
	content: "";
}
main section#shopping-guide div.block-flow div.list div.row p.image {
	position: relative;
	width: auto;
	height: auto;
	right: auto;
	top: auto;
	margin-bottom: 40px;
}
main section#shopping-guide div.block-thanks ul li,
main section#shopping-guide div.block-mail {
	text-align: justify;
}
main section#shopping-guide div.block-thanks ul li {
	position: relative;
	padding-left: 20px;
}
main section#shopping-guide div.block-thanks ul li::before {
	position: absolute;
	left: 6px;
	top: 12px;
	margin-right: 0px;
}
main section#shopping-guide div.block-tel {
	width: auto;
}
main section#faq div.inner-section {
	padding-left: 0px;
}
main section#law div.block h2 {
	margin-bottom: 60px;
}

/* contact
-------------------------------------------------------------------------------- */

main section#contact div.inner-section {
	width: auto;
}
main section#contact div.header {
	margin-bottom: 60px;
}
main section#contact div.form div.component-last {
	margin-bottom: 60px;
}
main section#contact div.mw_wp_form_preview div.form div.component {
	padding: 20px 0px;
}
main section#contact div.form div.component-radio div.body {
	display: block;
}
main section#contact div.form div.component-radio div.body span.horizontal-item:not(:last-child) {
	margin-right: 0px;
}
main section#contact div.form div.action {
	display: block;
}
main section#contact div.form div.action input[type=submit] {
	margin: 0px auto 20px auto;
}
main section#contact div.form div.action input[name=submitBack] {
	margin-right: auto;
}

/* register
-------------------------------------------------------------------------------- */

main section#family div.inner-section {
	width: auto;
}

main section#family div.inner-section {
	width: auto;
}
main section#family div.frame {
	padding: 40px 20px;
}
main section#family div.frame div.list {
	display: block;
	margin: 0px;
}
main section#family div.frame div.list div.row {
	width: auto;
	margin: 0px;
}
main section#family div.frame div.list div.row:not(:last-child) {
	margin-bottom: 20px;
}

@media screen and ( width < 640px) {
	main section#family div.frame div.header h2 {
		font-size: 1.4rem;
		margin-bottom: 0;
	}
	main section#family header p{
		text-align: left;
		padding-inline: 15px;
	}
	main section#family header p br{
		display: none;
	}
}


/* privacy-policy
-------------------------------------------------------------------------------- */

main section#privacy-policy div.inner-section {
	width: auto;
}



/* --------------------------------------------------------------------------------
modal
-------------------------------------------------------------------------------- */

div#modal div.inner-modal {
	width: calc(100% - 40px);
}
div#modal p.button-close {
	width: 60px;
	height: 60px;
}
body.admin-bar div#modal p.button-close {
	top: 0px;
}
div#modal section {
	padding: 20px;
}
div#modal section.slide p.first {
	display: none;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 100px;
	height: 100px;
	left: calc(50% - 50px);
	top: calc(50% - 50px);
	color: #ffffff;
	z-index: 1;
	pointer-events: none;
	background-color: rgba(172, 167, 110, 0.875);
	border-radius: 50%;
}
div#modal.first section.slide p.first {
	display: flex;
	animation: 0.5s first-01 2s ease-in-out 1 forwards;
}
@keyframes first-01 {
	0% { opacity: 1; }
	100% { opacity: 0; }
}
div#modal section.slide p.first span {
	display: block;
	position: relative;
	padding-left: 3px;
}
div#modal section.slide p.first span::before,
div#modal section.slide p.first span::after {
	position: absolute;
	top: -8px;
	font-family: "icon";
	content: "\e909";
}
div#modal section.slide p.first span::before {
	right: calc(50% + 12px);
	transform: scaleX(-1);
}
div#modal section.slide p.first span::after {
	left: calc(50% + 12px);
}
div#modal section.slide p.first span i.icon {
	display: block;
	font-size: 2.25rem;
	line-height: 2.25rem;
	animation: 1s first-02 0.5s linear 1 forwards;
}
@keyframes first-02 {
	0% { transform: translateX(0px); }
	25% { transform: translateX(-4px); }
	50% { transform: translateX(0px); }
	75% { transform: translateX(4px); }
	100% { transform: translateX(0px); }
}
div#modal section.slide div.pager {
	display: none;
}
div#modal section.slide-chocolat div.list div.row p.image {
	padding-top: 45px;
}
div#modal section.slide-chocolat div.list div.row-liqueur p.image::before {
	left: calc(50% + 50px);
	bottom: 20px;
}
div#modal section.slide-chocolat div.list div.row p.image img {
	width: 120px;
}
div#modal section.slide-chocolat div.list div.row p.image span.feature {
	height: 42px;
}
div#modal section.slide-archives-2021 div.list div.row p.illust img {
	width: 180px;
}




/* --------------------------------------------------------------------------------
footer
-------------------------------------------------------------------------------- */

footer#footer {
	padding-top: 80px;
}
footer#footer div#trigger-footer {
	top: 50px;
}
footer#footer p#button-page-top {
	left: calc(50% - 20px);
	bottom: 10px;
}
footer#footer p#button-page-top a {
	width: 40px;
	height: 40px;
}
footer#footer p#button-page-top a::before,
footer#footer p#button-page-top a::after {
	width: 12px;
	height: 12px;
	left: calc(50% - 6px);
	top: calc(50% - 6px);
}
footer#footer div.information {
	padding-bottom: 10px;
}
footer#footer div.information div.banner-family a {
	max-width: calc(100% - 60px);
}
footer#footer div.information nav#navi-footer div.list {
	display: block;
	width: auto;
}
footer#footer div.information nav#navi-footer div.list div.row {
	width: auto;
}
footer#footer div.information nav#navi-footer div.list div.row:not(:last-child) {
	margin-bottom: 30px;
}
footer#footer div.information nav#navi-footer div.list div.row:nth-child(2) {
	width: auto;
}
footer#footer div.information div.links ul {
	display: block;
}
footer#footer div.information div.links ul li {
	text-align: center;
}
footer#footer div.information div.links ul li:not(:last-child) {
	margin: 0px 0px 5px 0px;
}

/* home
-------------------------------------------------------------------------------- */

body.home footer#footer div#trigger-footer,
body.fs-body-top footer#footer div#trigger-footer {
	top: 90px;
}
body.home footer#footer p#button-page-top,
body.fs-body-top footer#footer p#button-page-top {
	bottom: 50px;
	height: 40px;
}
body.home footer#footer div.information,
body.fs-body-top footer#footer div.information {
	padding-bottom: 50px;
}

main section#home-family header a {
	width: 340px;
}

/* feature
-------------------------------------------------------------------------------- */
main section#feature header h1{
	font-size: 1.3rem;
}
main section#feature .block .header p{
	font-size: 1.2rem;
	margin-bottom: 1.7rem;
}
main section#feature .block .header h2{
	font-size: 1.7rem;
	letter-spacing: .3rem;
	margin-bottom: 1.6rem;
}
main section#feature .block .header h2 span{
	margin-bottom: 3rem;
}
main section#feature .block .header h3{
	font-size: 1rem;
	margin-bottom: 1rem;
	letter-spacing: .1rem;
	line-height: 1.6;
}
main section#feature .block .lead p{
	font-size: .9rem;
	letter-spacing: .155rem;
	line-height: 1.7;
	margin-bottom: 3rem;
}
main section#feature{
	background-position:calc(50vw - 330px) 920px;
}
main section#feature .block #message {
	margin-top: 55px;
}
main section#feature .block #message h3{
	line-height: 1.8;
	margin-top: 10px;
}
main section#feature .block #message .text{
	padding: 35px 25px;
}
main section#feature .block #items div.fs-c-productList{
	padding-top: 0px;
	margin-bottom: 5rem;
}
main section#feature #feature-01{
	margin-bottom: 100px;
}
main section#feature #feature-01.block .list p.image img{
	padding-bottom: 200px;
	margin-inline: auto;
}
main section#feature .block #items .header{
	padding:24px 15px;
}
main section#feature .block #items .header h2{
	font-size: 1rem;
}
main section#feature .block #items #viewmore h3{
	font-size: 1rem;
	margin-bottom: 0;
}
main section#feature #feature-02 #grenade .row .text p{
	font-size: 1rem;
	margin-bottom: 0px;
}
@media screen and (width < 768px) {
  main section#feature{
    background-position:calc(50vw - 330px) 965px;
  }
  main section#feature .block .lead{
    max-width: 400px;
    margin-inline: auto;
  }
  main section#feature .block #message .text .profile p img{
    width: 147px;
  }
  main section#feature .block #message .text p{
    font-size:15px;
    letter-spacing: .15rem;
  }
  main section#feature #feature-02 #grenade .row{
    display: block;
    width: 100%;
    max-width: 400px;
    margin-inline: auto;
  }
  main section#feature #feature-02 #grenade .row >*{
		margin-inline: auto;
  }

	main section#feature #feature-02 #grenade .row:nth-child(1) p.image{
		margin-bottom: 25px;
	}
	main section#feature #feature-02 #grenade .row:nth-child(1) p.image img{
		margin-top: 0px;
	}
}
@media screen and (width < 420px) {
  main section#feature{
    background-position:calc(50vw - 330px) 985px;
  }
	main section#feature #feature-01.block .list p.image img {
		padding-bottom: 220px;
	}
}