@charset "UTF-8";
/*
Theme Name: Multi Mall Hub
Author: Peron
Version: 0.02.2
*/
:root {
	/* Fonts */
	/* Font Family */
	--global--font-family: -apple-system,BlinkMacSystemFont,YakuHanJPs, Roboto, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Arial, nc3Jp, sans-serif;
 
	/* Font Size */
	--global--font-size-base-sp: 20px;
	--global--font-size-base: 18px;
	--global--font-size-xs: 0.6rem;
	--global--font-size-sm: 0.8rem;
	--global--font-size-md: 1.0rem;
	--global--font-size-lg: 1.2rem;
	--global--font-size-xl: 1.4rem;
	--global--font-size-xxl: 1.8rem;
	--global--font-size-xxxl:  2.0rem;

	/* Line Height */
	--global--line-height: 1.8;
	--global--line-height-headline: 1.5;
	/* Letter Spacing */
	--global--letter-spacing: .04rem;

	/* Font Weight */
	--global--font-weight: 400;
	--global--font-weight-bold: 800;

	/* Colors */
	/* Site Colors */
	--global--color-lightest: #EDE9ED;
	--global--color-lighter: #B5A7B6;
	--global--color-light: #7E647F;
	--global--color-base: #472248;
	--global--color-dark: #321832;
	--global--color-darker: #241124;

	/* Basic Colors */
	--global--color-black: #000;
	--global--color-white: #fff;
	--global--color-white-50: rgba(255, 255, 255, 0.5);
	--global--color-white-90: rgba(255, 255, 255, 0.9);
	--global--color-green: #d1e4dd;
	--global--color-blue: #3167AC;
	--global--color-purple: #d1d1e4;
	--global--color-red: #e4d1d1;
	--global--color-orange: #EE7E6F;
	--global--color-yellow: #E9CD58;

	/* Layout Settings */
	/* Column width */
	--global--column-width-max: 100%;
	--global--column-width-wide: 1120px;
	--global--column-width-main: 880px;
	--global--column-width-article: 620px;
	--global--column-width-aside: 240px;

	/* Breake Points */
	/*　sp: 600px;
	/*　tb: 880px;
	/*　pc: 1120px;(2clum)
	/*　pc: 100%;(3clum)

	/* Spacing */
	--global--spacing-zero: 0px;
	--global--spacing-sm: 5px;
	--global--spacing-md: 15px;
	--global--spacing-lg: 25px;
	--global--spacing-xl: 50px;

	/* Decoration */
	/* radius */
	--global--radius-sm: 5px;
	--global--radius-md: 10px;
	--global--radius-lg: 25px;

	/* Opacity */
	--global--opacity-70: 70%;
	--global--opacity-50: 50%;

	/* Transition */
	--global--transition: 0.25s;
}

/************************/
/* Layout */
/************************/

header{
	display: grid;
	width: var(--global--column-width-max);
	background-color: var(--global--color-lightest);
	padding: var(--global--spacing-md);
 	grid-template-columns:var(--global--column-width-aside) 1fr;
    align-items: center;
}
main{
	display: grid;
 	grid-template-columns:1fr var(--global--column-width-article) 1fr;
 	column-gap: var(--global--spacing-md);
	margin: var(--global--spacing-xl) auto;
}
main#salelist,
main#archives{
 	grid-template-columns:var(--global--column-width-aside) 1fr;
}
main article{
	order: 1;
}
main aside#aside-main{
	order: 0;
}
main aside#aside-sub{
	order: 2;
}

main aside div{
	position: sticky;
	top:0;
}
main aside#toc div{
	position: sticky;
	top:0;
}

footer{
	width: var(--global--column-width-max);
}

/*2column*/
@media screen and (max-width: 1120px) {
	main{
		display: grid;
	 	grid-template-columns:var(--global--column-width-aside) var(--global--column-width-article);
	 	column-gap: var(--global--spacing-md);
		max-width: var(--global--column-width-main);
		margin: var(--global--spacing-xl) auto;
	}
	main article{
		order: 1;
	}
	main aside#aside-main{
		order: 0;
	}
	main aside#aside-sub{
		display:none;
	}
}

/*tb*/
@media screen and (max-width: 880px) {
	main#salelist,
	main#archives,
	main{
		display: grid;
	 	grid-template-columns:1fr;
	 	column-gap: var(--global--spacing-zero);
		margin: var(--global--spacing-zero) auto;
	}
	main article{
		order: 0;
		min-width: var(--global--column-width-aside);
	}
	main aside#aside-main{
		order: 1;
	}
	main aside#aside-sub{
		display:none;
	}
	main aside div{
		position: static;
		top:0;
	}
	footer div#footer-sitemap{
	 	grid-template-columns:1fr;
	}
}

/*sp*/
@media screen and (max-width: 600px) {
}

/************************/
/* Elements */
/************************/

html{
	word-break: break-all;
	font-family: var(--global--font-family);
	font-size: var(--global--font-size-base);
}

body{
	font-weight: var(--global--font-weight);
	line-height: var(--global--line-height);
	color: var(--global--color-darker);
	background-color: var(--global--color-lightest);
}

main article section{
	padding: 0;	
	letter-spacing: var(--global--letter-spacing);
}
img{
	max-width: 100%;
	height: auto;
}
a{
	text-decoration: none;
	color: var(--global--color-base);
}
a:hover{
	text-decoration: none;
	opacity: var(--global--opacity-70);
	transition:  var(--global--transition);
}
main a{
	color: var(--global--color-blue);
}
main p{
	font-size: var(--global--font-size-md);
	padding: var(--global--spacing-md) 0;
}
main h1{
	font-size: var(--global--font-size-xxxl);
	line-height: var(--global--line-height-headline);
	margin:var(--global--spacing-xl) 0;
}
main h2{
	font-size: var(--global--font-size-xxl);
	line-height: var(--global--line-height-headline);
	margin-top:var(--global--spacing-xl);
	margin-bottom:var(--global--spacing-md);

}
main h3{
	font-size: var(--global--font-size-xl);
	line-height: var(--global--line-height-headline);
	margin-top:var(--global--spacing-xl);
	margin-bottom:var(--global--spacing-md);
}
main h4{
	font-size: var(--global--font-size-lg);
	line-height: var(--global--line-height-headline);
	margin-top:var(--global--spacing-xl);
	margin-bottom:var(--global--spacing-md);
}


button{
	background-color: var(--global--color-darker);
	border: none;
	color:  var(--global--color-lightest);
	padding: var(--global--spacing-md) var(--global--spacing-md);
	text-align: center;
	text-decoration: none;
	font-size: var(--global--font-size-sm);
	border-radius: var(--global--radius-sm);
	cursor: pointer;
}

@media screen and (max-width: 880px) {
	html{
		font-size: var(--global--font-size-base-sp);
	}
	main article section{
		padding: 0 var(--global--spacing-md);	
	}
	main h1{
		font-size: var(--global--font-size-xl);
		margin:var(--global--spacing-xl) 0;
	}
	main h2{
		font-size: var(--global--font-size-xl);
	}
	main h3{
		font-size: var(--global--font-size-lg);
	}
	main h4{
		font-size: var(--global--font-size-md);
	}
}

/************************/
/* TemplateBlocks */
/************************/

/* header */
header nav.gnav ul.gnav-menu a{
	font-size: var(--global--font-size-sm);
	color: var(--global--color-darker);
	text-decoration: none;
}
header nav.gnav ul.gnav-menu a:hover{
	color: var(--global--color-lighter);
}
img.custom-logo{
	width: 150px;
	height: auto;
}
nav.gnav ul {
	list-style: none;
	display: flex;
	flex-direction: row;
	column-gap: var(--global--spacing-lg);
    justify-content: flex-end;
    align-items: center;
    margin: var(--global--spacing-zero);
}
input.gnav-checkbox,
label.gnav-btn {
	display: none;
}
@media screen and (max-width: 880px) {
	nav.gnav ul.gnav-menu {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		visibility: hidden;
		opacity: 0;
		transition: visibility 0s linear 0.5s, opacity 0.5s;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background-color: rgba(0, 0, 0, 0.95);
	}
	nav.gnav ul.gnav-menu li{
		padding: var(--global--spacing-md);
	}
	nav.gnav ul.gnav-menu li a{
		font-size: var(--global--font-size-xl);
		color: var(--global--color-lighter);
	}
	nav.gnav ul.gnav-menu li a:hover{
		color: var(--global--color-base);
	}
	input.gnav-checkbox:checked ~ ul.gnav-menu {
		visibility: visible;
		opacity: 1;
		transition: opacity 0.5s ease-in-out, visibility 0s linear;
	}
	input.gnav-checkbox {
		clip-path: inset(50%);
		inset-block-start: 0;
	}
	label.gnav-btn {
		position: fixed;
		top: 20px;
		right: 20px;
		z-index: 9999;
		border: solid 0px;
		border-radius: 50%;
		box-sizing: border-box;
		cursor: pointer;
		display: block;
		height: 32px;
		width: 32px;
		color: var(--global--color-darker);
		background:
			linear-gradient(currentcolor, currentcolor) no-repeat,
			linear-gradient(currentcolor, currentcolor) no-repeat,
			linear-gradient(currentcolor, currentcolor) no-repeat,
			linear-gradient(currentcolor, currentcolor) no-repeat;
		background-position:
			50% -2em,
			50% 50%,
			50% calc(50% - 0.375em),
			50% calc(50% + 0.375em);
		background-size:
			0.125em 1em,
			1em 0.125em,
			1em 0.125em,
			1em 0.125em;
		transition:
			transform 0.4s 0s,
			background-position 0.4s 0.4s;
  	}
	input.gnav-checkbox:checked ~ label.gnav-btn {
		color: var(--global--color-lighter);
		background-position:
			50% 50%,
			50% 50%,
			-2em calc(50% - 0.375em),
			2em calc(50% + 0.375em);
		transform: rotate(45deg);
		transition:
			background-position 0.4s 0s,
			transform 0.4s 0.4s;
	}
}

/* footer */
footer{
	font-size: var(--global--font-size-sm);
	background-color: var(--global--color-lighter);
}
footer ul{
	list-style: none;
	padding-left: 0;
}
footer ul li ul{
	padding-left: var(--global--spacing-md);
}
footer ul li ul li:before{
	content: ' - ';
}

footer div#footer-sitemap{
	width: var(--global--column-width-max);
	display: grid;
 	grid-template-columns:2fr 2fr 1fr;
 	column-gap: var(--global--spacing-xl);
	padding: var(--global--spacing-xl);
	margin: 0 auto;
}
footer nav ul{
	display: flex;
	justify-content: center;
	column-gap: var(--global--spacing-lg);
	color: var(--global--color-lighter);
	background-color: var(--global--color-lightest);
	margin: 0;
}
footer div#copyright{
	display: grid;
	width: var(--global--column-width-max);
	background-color: var(--global--color-light);
	padding: var(--global--spacing-md);
	grid-template-columns:1fr 9fr;
	align-items: center;
	justify-items: end;
}

@media screen and (max-width: 1120px) {
	footer div#footer-sitemap{
		width: var(--global--column-width-max);
	 	grid-template-columns:1fr;
	 	column-gap: var(--global--spacing-lg);
		padding: var(--global--spacing-lg);
	}

}

/* Aside */
aside div#aside-01,
aside div#aside-02{
	font-size: var(--global--font-size-sm);
	padding: var(--global--spacing-md);
}
aside div#aside-02{
	font-size: var(--global--font-size-sm);
	padding: var(--global--spacing-md);
}
aside div#aside-01 ul{
	list-style: none;
	padding-left: var(--global--spacing-md);
}
aside div#aside-02 ol{
	list-style-type: upper-roman;
	padding-left: var(--global--spacing-md);
}
aside div#aside-01 ul li a{
	color: var(--global--color-base);
}

aside div#aside-02{
	margin-left: var(--global--spacing-md);
	padding:  var(--global--spacing-lg);
}

/************************/
/*  Common Parts */
/************************/

.ac{text-align: center;}
.ar{text-align: right;}

/* Breadcrumbs */
div#breadcrumbs{
	font-size: var(--global--font-size-xs);
	padding: var(--global--spacing-sm);
	background-color: var(--global--color-lighter);
}
/* Link Headline */
div.link-headline{
	display: flex;
    align-items: center;
    gap: var(--global--spacing-lg);
	margin: var(--global--spacing-xl) 0 var(--global--spacing-md) 0;
}
div.link-headline h2{
	margin: 0;
	padding: 0;
}
div.link-headline span{
	margin: 0;
	padding: 0;
	font-size: var(--global--font-size-sm);
	color: var(--global--color-light);
}
/* Link btn */
/* Tagcloud */
div.linkbtn-list ul{
	display: inline;
	padding: 0;
	margin: 0;
}
div.linkbtn-list li{
	display: inline;
	list-style: none;
}
div.tagcloud a,
div.linkbtn-list li a{
	display: inline-block;
	padding: 2px 10px;
	text-decoration: none;
	border-radius: 50px;
	background-color: var(--global--color-base);
	color: var(--global--color-lighter);
	margin-top: var(--global--spacing-sm);
	margin-right: var(--global--spacing-sm);
	font-size: var(--global--font-size-xs);
}
div.linkbtn-list ul.tags li a{
	background-color: var(--global--color-dark);
}
div.tagcloud a:before,
div.linkbtn-list ul.tags li a:before{
	content: '#';
}

/* Archive List */
main#archives article{
	width: 100%;
	overflow-x: hidden;
}
main#archives article section.listpickup,
main#archives article section.listmax{
	display: flex;
	width: var(--global--column-width-max);
	gap: var(--global--spacing-md);
	white-space: nowrap;
	overflow-x: scroll;
	margin-bottom: calc( 2 * var(--global--spacing-xl));
}
main#archives article section.listwide{
	display: grid;
 	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	gap: var(--global--spacing-lg);
	margin-bottom:var(--global--spacing-xl) ;
}
@media screen and (max-width: 1120px) {
	main#archives article section.listwide{
	 	grid-template-columns: 1fr 1fr 1fr;
	}
}
@media screen and (max-width: 880px) {
	main#archives article section.listwide{
	 	grid-template-columns: 1fr 1fr 1fr;
	}
}
@media screen and (max-width: 600px) {
	main#archives article section.listwide{
		gap: var(--global--spacing-md);
	 	grid-template-columns: 1fr 1fr;
	}
}
main#archives article section div.postlist{
	width: 100%;
	white-space:normal;
	line-height: var(--global--line-height-headline);
}
main#archives article section div.postlist img{
	width: 100%;
	height: 100px;
	object-fit: cover;
	object-position: center;
	border-radius: var(--global--radius-sm);
}
main#archives article section.listmax div.postlist{
	max-width: 120px;
	min-width: 180px;
}
main#archives article section.listpickup div.postlist{
	max-width: 300px;
	min-width: 250px;
}
main#archives article section.listpickup div.postlist img{
	width: 100%;
	height: 180px;
	object-fit: cover;
	object-position: center;
	border-radius: var(--global--radius-sm);
}
main#archives article section div.postlist span{
	display: block;
	font-size: var(--global--font-size-xs);
	margin-bottom: var(--global--spacing-sm);
}
main#salelist article section div.saleblock p.post-title,
main#archives article section div.postlist p.post-title a{
	font-weight: var(--global--font-weight-bold);
	color: var(--global--color-darker);
	font-size: var(--global--font-size-sm);
}
main#salelist article section div.saleblock div.linkbtn-list a,
main#archives article section div.postlist div.linkbtn-list a{
	font-size: var(--global--font-size-xs);
	background-color: var(--global--color-light);
	color: var(--global--color-lightest);
}

/* Internal Link */
a.internal-link-card {
	display: grid;
 	grid-template-columns:3fr 1fr;
	width: 100%;
	border: 1px solid var(--global--color-lighter);
	color: var(--global--color-darker);
	line-height: var(--global--line-height-headline);
	background-color: var(--global--color-white);
	border-radius: var(--global--radius-sm);
	margin: var(--global--spacing-lg) 0;
}
a:hover.internal-link-card {
	background-color: var(--global--color-lightest);
}

a.internal-link-card div{
	padding: var(--global--spacing-sm) var(--global--spacing-lg);
}
a.internal-link-card div.blog-card-thumbnail{
	padding: 0;
}
a.internal-link-card div.blog-card-thumbnail img{
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center;
}
a.internal-link-card p{
	font-size: var(--global--font-size-sm);
}
a.internal-link-card p strong{
	font-size: var(--global--font-size-md);
}
@media screen and (max-width: 880px) {
	a.internal-link-card {
	 	grid-template-columns:2fr 1fr;
	}
	a.internal-link-card div{
		padding: var(--global--spacing-sm) var(--global--spacing-md);
	}
	a.internal-link-card p{
		font-size: var(--global--font-size-xs);
		padding: var(--global--spacing-sm) 0;
	}
	a.internal-link-card p strong{
		font-size: var(--global--font-size-sm);
	}

}
/* Recent Posts */
ul.recent_posts li{
	display: grid;
	grid-template-columns:1fr 80px;
	width: 100%;
	align-items: center;
	gap: var(--global--spacing-sm);
	margin: var(--global--spacing-sm) 0;
	border-bottom: 1px solid var(--global--color-light);
	padding: var(--global--spacing-sm);
	line-height: var(--global--line-height-headline);
}
ul.recent_posts li img{
	height: 50px;
	width: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: var(--global--radius-sm);
}
ul.recent_posts li a span{
	font-size: var(--global--font-size-xs);
	color: var(--global--color-light);
}

/*Related Posts List*/
div.content-related{
	height: 400px;
	overflow-y: scroll;
}
div.content-related h4{
	margin-top: var(--global--spacing-md);
}

div.content-related ul{
	width: 100%;
	list-style: none;
	padding: 0;
}
div.content-related ul li{
	padding: var(--global--spacing-sm);
	min-height: 80px;
	border-bottom: 1px dotted var(--global--color-lighter);
}
div.content-related ul li a{
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: var(--global--spacing-md);
    align-items: center;
}
div.content-related ul li a p{
	font-size: var(--global--font-size-sm);
}


/* Pagination */
nav.pagination ul {
	list-style: none;
	padding: 0;
	display: flex;
	justify-content: center;
}
nav.pagination li {
	margin: var(--global--spacing-sm);
}
nav.pagination li a {
	display: block;
	padding: var(--global--spacing-sm) var(--global--spacing-md);
	border: 1px solid var(--global--color-light);
	border-radius: var(--global--radius-sm);
	background-color: var(--global--color-lighter);
	color: var(--global--color-lightest);
	font-size: var(--global--font-size-sm);
}
nav.pagination li a:hover {
	border: 1px solid var(--global--color-light);
}
nav.pagination li span.current {
	display: block;
	padding: var(--global--spacing-sm) var(--global--spacing-md);
	border: 1px solid var(--global--color-light);
	border-radius: var(--global--radius-sm);
	background-color: var(--global--color-base);
	font-size: var(--global--font-size-sm);
	color: var(--global--color-lightest);
}

/* Talk Icons */
.talk_icon {
	margin-bottom: 40px;
	display: flex;
}
.talk_icon:after,
.talk_icon:before {
	clear: both;
	content: "";
	display: block;
}
.talk_icon div.talk_icon_image {
	width: 15%;
	max-width: 120px;
	text-align: center;
	margin: 0 10px;
}
.talk_icon div.talk_icon_image img{
	max-height: 90px;
	border: 2px solid var(--global--color-border);
	border-radius: 50% !important;
	margin: 0;
	background-color: #fff;
}
.talk_icon div.talk_icon_image span{
	display: block;
	font-size: var(--global--font-size-xs);
}

/* 左側アイコン */
.talk_icon div.talk_icon_text_a {
	width: 70%;
	color: #444;
	position: relative;
	padding: 1.2em;
	border: 3px solid #F7F6F6;
	background-color: #F7F6F6;
	border-radius:var(--global--radius-md);
	display: flex;
	align-items: center;
}
.talk_icon div.talk_icon_text_a:before {
	position: absolute;
	content: '';
	border: 10px solid transparent;
	border-right: 10px solid #F7F6F6;
	top: 15px;
	left: -20px;
}
.talk_icon div.talk_icon_text_a:after {
	position: absolute;
	content: '';
	border: 10px solid transparent;
	border-right: 10px solid #F7F6F6;
	top: 15px;
	left: -16px;
}

/* 右側アイコン */
.talk_icon div.talk_icon_text_b {
	width: 70%;
	color: #444;
	position: relative;
	padding: 1.2em;
	border: 3px solid #6BDF73;
	background-color: #6BDF73;
	border-radius:var(--global--radius-md);
	display: flex;
	align-items: center;
	margin-left: 10%;
}
.talk_icon div.talk_icon_text_b:before {
	position: absolute;
	content: '';
	border: 10px solid transparent;
	border-left: 10px solid #6BDF73;
	top: 15px;
	right: -20px;
}
.talk_icon div.talk_icon_text_b:after {
	position: absolute;
	content: '';
	border: 10px solid transparent;
	border-left: 10px solid #6BDF73;
	top: 15px;
	right: -16px;
}

/*レビュースター*/
p.star-rating span{
	padding-left: var(--global--spacing-sm);
	position: relative;
	font-size: var(--global--font-size-sm);
	word-break: keep-all;
}
p.star-rating span:before,
p.star-rating span:after{
	content: "★★★★★";
	color: #e1e1e1;
	position: absolute;
	word-wrap: normal;
}
p.star-rating span:after{
	color: #ffb448;
	overflow: hidden;
	width: calc(var(--global--font-size-sm)*var(--starwidth));
}

/************************/
/* Theme Template */
/************************/

/****** Single & Page******/

article.page section,
article.post section{
    margin-bottom: var(--global--spacing-xl);
}

/*entry-header*/
section.entry-header span{
	color: var(--global--color-light);
	font-size: var(--global--font-size-sm);	
}
section.entry-header div.author{
	display: grid;
 	grid-template-columns:50px 1fr;
	align-items: center;
	grid-gap: var(--global--spacing-md);
	line-height: var(--global--line-height-headline);
	margin:var(--global--spacing-lg) 0;
}
section.entry-header div.author p{
	color: var(--global--color-light);
	font-size: var(--global--font-size-sm);	
}

section.entry-header div.author img{
	border-radius: 50%;
}

/*entry-content*/
section.entry-content div.toc{
	font-size: var(--global--font-size-sm);
	line-height: var(--global--line-height-headline);
	background-color: var(--global--color-lightest);
	border: 1px solid  var(--global--color-lighter);
	padding: var(--global--spacing-lg);
}
section.entry-content div.toc ol{
	list-style: none;
	padding-left: var(--global--spacing-sm);
}
section.entry-content div.toc ol ol{
	padding-left: var(--global--spacing-lg);
}

section.entry-content div.toc li li{
	font-size: var(--global--font-size-xs);
}
section.entry-content div.toc a{
	display: block;
	padding: var(--global--spacing-sm);
	color: var(--global--color-light);
	border-bottom: 1px solid  var(--global--color-lighter);
}
section.entry-content div.toc a:hover{
	color: var(--global--color-lighter);
}

/*entry-footer*/
section.entry-footer span{
	color: var(--global--color-light);
	font-size: var(--global--font-size-sm);	
}
nav.post-navigation {
	padding: var(--global--spacing-lg) 0;
	margin:  var(--global--spacing-xl) 0;
	border-top: 1px solid  var(--global--color-lighter);
	border-bottom: 1px solid  var(--global--color-lighter);
}
nav.post-navigation ul {
	display: grid;
 	grid-template-columns:1fr 1fr;
	width: 100%;
	list-style: none;
	padding: 0;
	margin: 0;
	gap: var(--global--spacing-xl);
}
nav.post-navigation ul li:last-child{
	justify-self: end;
	text-align: right;
}
nav.post-navigation li span{
	display: block;
	font-size: var(--global--font-size-xs);
}
nav.post-navigation a {
	display: block;
	font-size: var(--global--font-size-sm);
	text-decoration: none;
}


/****** Home ******/
#mainv{
	display:flex;
	width: var(--global--column-width-max);
	height: 50vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	justify-content: center;
	align-items: center;
	margin-bottom:0;
}
#mainv div.mainv-text{
	color: var(--global--color-lightest);
	font-size: var(--global--font-size-xl);
	text-align: center;
	font-weight: var(--global--font-weight-bold);
	background-color: rgba(0,0,0,0.3);
	border: 2px solid var(--global--color-lightest);
	padding: var(--global--spacing-lg);
}
#mainv div.mainv-text p span{
	display: block;
	font-size: var(--global--font-size-sm);
}
ul.child-categories{
	padding: var(--global--spacing-md);
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	gap: var(--global--spacing-md);
	font-size: var(--global--font-size-sm);
	align-items: center;
}
ul.child-categories li{
}

ul.child-categories li a{
	display: grid;
	grid-template-columns: 30px 1fr;
	gap: var(--global--spacing-sm);
	align-items: center;
}
ul.child-categories li a img{
	gap: var(--global--spacing-sm);
	border-radius: 50%;
}
ul.child-categories li a span{
}


@media screen and (max-width: 1120px) {
	#mainv{
		margin-bottom: var(--global--spacing-xl);
		padding: var(--global--spacing-md);
	}
	ul.child-categories{
		padding: var(--global--spacing-sm);
		grid-template-columns: 1fr 1fr 1fr;
		font-size: var(--global--font-size-xs);
	}
	ul.child-categories li a{
		grid-template-columns: 20px 1fr;
	}

}

/****** Archive ******/

#mainv-archive{
	display:flex;
	width: var(--global--column-width-max);
	height: 20vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	justify-content: center;
	align-items: center;
	margin-bottom:0;
}
#mainv-archive h1{
	color: var(--global--color-lightest);
	font-size: var(--global--font-size-xxl);
	text-align: center;
	text-shadow: 0px 1px 3px rgba(0,0,0,0.5);
}

@media screen and (max-width: 1120px) {
	#mainv-archive{
		margin-bottom: var(--global--spacing-xl);
	}
}

/****** 404 ******/

.page-not-found{
	background-color: var(--global--color-base);
}
#page-not-found section{
	text-align: center;
}
#page-not-found section h2{
	font-size: var(--global--font-size-xxxl);
}


/****** Product Archive ******/

main#salelist article{
	width: var(--global--column-width-max);
}
main#salelist article section.salelist{
	display: grid;
 	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: var(--global--spacing-md);
	margin-bottom:var(--global--spacing-xl) ;
}
@media screen and (max-width: 1120px) {
	main#salelist article section.salelist{
	 	grid-template-columns: 1fr 1fr 1fr;
	}
}
@media screen and (max-width: 880px) {
	main#salelist article section.salelist{
	 	grid-template-columns: 1fr 1fr;
	}
}

@media screen and (max-width: 600px) {
	main#salelist article section.salelist{
	 	grid-template-columns: 1fr;
	}
}

main#salelist article section div.saleblock{
	display: flex;
	max-width: 100%;
	white-space:normal;
	line-height: var(--global--line-height-headline);
	font-size: var(--global--font-size-sm);
    position: relative;
	background-color: var(--global--color-white);
	flex-direction: column;
	align-items: center;
	justify-content: space-around;
	border-radius: var(--global--radius-sm);
	padding: var(--global--spacing-md);
}

main#salelist article section div.saleblock img{
	width: 100%;
	height: 150px;
	object-fit: cover;
	object-position: center;
}
main#salelist article section div.saleblock p{
	padding: var(--global--spacing-sm) 0;
	margin: 0;
	font-size: var(--global--font-size-sm);
}
main#salelist article section div.saleblock p.update{
	padding: var(--global--spacing-sm) 0;
	font-size: var(--global--font-size-xs);
}



/*セールバッジ（リボン）*/
main#salelist article section div.saleblock p.sale_badge{
	position: absolute;
	top: 15px;
	right: -10px;
	padding: var(--global--spacing-sm) var(--global--spacing-md);
	font-size: var(--global--font-size-xs);
	background-color: #FFA74B;
	font-weight: var(--global--font-weight-bold);
}
main#salelist article section div.saleblock p.sale_badge:before {
	position: absolute;
	bottom: 100%;
	right: 0;
	width: 0px;
	height: 0px;
	border: none;
	border-top: 5px solid transparent;
	border-left: 10px solid #333;
	content: '';
}
/*セール上部カテゴリ*/
main#salelist article section div.category-list{
	background-color: var(--global--color-white-50);
	border-radius: var(--global--radius-sm);
	padding: var(--global--spacing-lg) var(--global--spacing-xl);
	font-size: var(--global--font-size-sm);
}
main#salelist article section div.category-list ul {
	display: grid;
 	grid-template-columns: 1fr 1fr 1fr;
	list-style: none;
	padding: 0;
	margin: 0;
	align-items: flex-start;
}
main#salelist article section div.category-list ul li{
	display: flex;
	list-style: none;
	align-items: center;
	gap: var(--global--spacing-md);
	align-items: flex-start;
}
main#salelist article section div.category-list ul li a{
	width:100px;
}
main#salelist article section div.category-list ul li ul{
	display: block;
	margin-bottom: var(--global--spacing-xl);
}
main#salelist article section div.category-list ul li ul li a{
	width:100%;
	display: flex;
	align-items: center;
	font-size: var(--global--font-size-xs);
	padding: var(--global--spacing-sm) 0;

}
main#salelist article section div.category-list img{
	width: 60px;
	height: 60px;
	border-radius: 50%;
}
main#salelist article section div.category-list ul li ul img{
	width: 30px;
	height: 30px;
	border-radius: 50%;
	margin-right: var(--global--spacing-md);
}


@media screen and (max-width: 1120px) {
	main#salelist article section div.category-list{
		padding: var(--global--spacing-sm);
	}
	main#salelist article section div.category-list ul {
	 	grid-template-columns: 1fr 1fr;
	}
	main#salelist article section div.saleblock{
		width: 100%;
		padding: var(--global--spacing-md);
	}
	main#salelist article section div.category-list ul li ul{
		margin-bottom: var(--global--spacing-md);
	}
	main#salelist article section div.category-list img{
		width: 40px;
		height: 40px;
	}
	main#salelist article section div.category-list ul li ul img{
		width: 25px;
		height: 25px;
	}
}

@media screen and (max-width: 600px) {
	main#salelist article section div.category-list ul {
	 	grid-template-columns: 1fr;
	}
	main#salelist article section div.category-list ul li ul{
		margin-bottom: var(--global--spacing-md);
		line-height: var(--global--line-height-headline);
	}
	main#salelist article section div.category-list ul li ul img{
		width: 15px;
		height: 15px;
	}	
}