@charset "UTF-8";
:root {
  --color-foreground:#56646b;
  --color-dark:rgb(81, 81, 81);
  --color-dark-light:rgb(150, 150, 150);
  --color-white:rgb(255, 255, 255);
  --color-light:rgb(239, 239, 239);
  --color-primary:rgb(207, 0, 0);
  --color-primary-light:rgb(204, 66, 66);
  --page-link-color: #247197;
  --page-link-hover-color: #2088BB;
  --page-line-hight: 1.8em;
  --breakpoint-sm: 480px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 960px;
  --breakpoint-xl: 1200px;
  --background-color:rgb(250, 250, 250);
  --background-white:var(--color-white);
  --background-light:var(--color-white);
  --background-dark:var(--color-dark);
  --background-dark-light:var(--color-dark-light);
  --background-color:rgb(250, 250, 250);
  --background-white:var(--color-white);
  --background-light:var(--color-light);
  --background-dark:var(--color-dark);
  --background-dark-light:var(--color-light);
  --border-rudius:0.5rem;
  --max-column-width: calc(1408px - 8rem);
  --tag-vintage : rgb(177,133,96);
  --tag-new : rgb(177,133,96);
  --tag-outlet : rgb(239,117,164);
  --tag-new : rgb(117, 174, 239);
  --tag-used : rgb(255,221,70);
  --tag-used-foreground : rgb(111,104,96);
  --tag-real : rgb(108,103,109);
  --tag-shippingfree : rgb(126,189,168);
  --tag-sale : rgb(239,118,117);
}


html {
  font-size: 62.5%;
  margin:0;
  padding:0;
}

body {
	font-size: 1.4rem;
	line-height: var(--page-line-hight);
	letter-spacing: 0.1rem;
	font-weight: 500;
	color: var(--color-foreground);
	background: var(--background-color);
	margin:0;
	padding:0;
	font-family: 
		"Hiragino Sans",
		Arial;
}

h1,h2,h3,h4,h5,h6{
	font-family: "Outfit" ,
		"Hiragino Sans",
		Arial;
	font-weight: 600;
}
h1{font-size:2.4rem;margin:2.4rem 0;line-height: 3.2rem;}
h2{font-size:1.8rem;margin:1.8rem 0}
h3{font-size:1.7rem;margin:1.7rem 0}
h4{font-size:1.6rem;margin:1.6rem 0}
h5{font-size:1.5rem;margin:1.5rem 0}
h6{font-size:1.4rem;margin:1.4rem 0}

hr{
	border:0;
	border-bottom: 1px solid var(--color-light);
	margin: 4rem 0 3rem 0;
}

div,p,input{
    box-sizing: border-box;
}

a{
	color:var(--page-link-color);
	text-underline-offset:0.3em;
}

.grid-main-contents a:hover,
.im-breadcrumb-container a:hover{
	color:var(--page-link-hover-color);
	text-underline-offset:0.3em;
}


p{
    padding: 0.2rem;
    margin-block: 0;
}

/* util */
.has-text-center{ text-align: center; }
.has-text-right{ text-align: right; }
.has-text-primary{
	color : var(--color-primary)
}
.is-fullwidth{ width: 100%; }

.is-end{
	justify-content:end !important
}

.is-start{
	justify-content:start !important
}

.is-align-item-center{
	align-items: center !important;
}

.is-align-item-end{
	align-items: end !important;
}

.is-align-self-end{
    align-self: end;
}

.is-overflow-hidden{
	overflow: hidden !important;
}

.has-text-overflow{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.m-2{
	margin:0.4rem
}

.is-flex{
	display: flex;
	align-items: start;
	justify-content: center;
	gap:0.46rem;
	flex-wrap: wrap;
}

.has-text-center{
	text-align: center;
}

.has-text-strong{
	font-weight: bold;
}



/* basic components */

.select{
	border: 1px solid var(--color-light);
	display: inline-block;
	border-radius: var(--border-rudius);
	padding-right:0.6rem;
	background: var(--color-white);

}
.select:focus-within{
	border: 1px solid var(--color-dark-light);
}

.select.is-primary{
	border: 1px solid var(--color-primary);
}

.select.is-primary:focus {
	border: 1px solid var(--color-primary-light);
}


.select select{
	border: 0;
	margin:0;
	padding: 0.6rem 0.9rem 0.6rem 0.9rem;
	background: var(--color-white);
	color: var(--color-foreground);
	font-size:1.4rem
}


.select select:focus{
	outline: 0;
}

.input {
	border: 1px solid var(--color-light);
	padding-right:0.6rem;
	padding-left:1.6rem;
	font-size:1.6rem;
	line-height: 2.9rem;
	border-radius: var(--border-rudius);
	box-sizing: border-box;
	color: var(--color-foreground);
}

.input.is-large {
	font-size:2.1rem;
	line-height: 3rem;
}

@media (max-width: 768px /*tablet*/){
	.input.is-large {
		font-size:1.3rem;
		line-height: 2rem;
	}

}

.input:focus {
	border: 1px solid var(--color-dark-light);
	padding-right:0.6rem;
	padding-left:1.6rem;
	outline: 0;
}

.input.is-primary{
	border: 1px solid var(--color-primary);
}

.input.is-primary:focus {
	border: 1px solid var(--color-primary-light);
}


.button{
	border: 0px solid var(--color-light);
	padding: 0;
	padding-right:1.6rem;
	padding-left:1.6rem;
	font-size:1.3rem;
	line-height: 3.3rem;
	border-radius: var(--border-rudius);
	background: var(--background-dark);
	color:var(--color-light);
	font-weight: 800;
	display: inline-block;
	text-decoration: none;
}
.button.is-large{
	padding-right: 2.2rem;
	padding-left: 2.2rem;
	font-size:1.7rem;
	line-height: 4.4rem;
}


.button.is-primary{
	background: var(--color-primary);
}

.button.is-primary:hover{
	background: var(--color-primary-light);
	color:var(--color-white)
}

.button.is-outline{
	border: 1px solid var(--color-light) !important;
	color: var(--color-foreground);
	background: transparent;
}

.button:hover{
	text-decoration: none;
}
.button.compose{
	display: flex;
	padding-left:1rem;
	align-items: center;
	justify-content: center;
}
.button.compose .icon{
	margin-top: -0.4rem;
	width: 1.8rem;
	height: 1.8rem;
	margin-right: 1rem;
}
.button.compose .icon svg{
	fill:var(--color-white)
}

.button.is-large.compose{
	display: flex;
	padding-left:1rem;
	align-items: center;
	justify-content: center;
}
.button.is-large.compose .icon{
	margin-top: -0.2rem;
	width: 2.6rem;
	height: 2.6rem;
	margin-right: 1rem;
}
.button.is-large.compose .icon svg{
	fill:var(--color-white)
}


.button.is-small{
	padding-right:1.6rem;
	padding-left:1.6rem;
	font-size:1.1rem;
	line-height: 2.8rem;
}

.button.compose.is-small{
	padding-left:1rem;
}
.button.compose.is-small .icon{
	margin-top: -0.4rem;
	width: 1.6rem;
	height: 1.6rem;
	margin-right: 1rem;
}

.with-arrow::after{
	content:'\00bb'
}


@media (max-width: 1024px /*tablet*/){
	.button.is-large.compose{
		display: flex;
		padding-left:0.6rem;
		align-items: center;
		justify-content: center;
	}
	.button.is-large{
		padding-right: 1.2rem;
		padding-left: 1.2rem;
		font-size: 1.2rem;
		line-height: 3.2rem;
	}
	.button.is-large.compose .icon{
		margin-top: -0.2rem;
		width: 1.8rem;
		height: 1.8rem;
		margin-right: 0.6rem;
	}
}




.label{
	display: inline-block;
	border: 1px solid var(--color-light);
	padding-right:1.6rem;
	padding-left:1.6rem;
	font-size:1.3rem;
	line-height: 3.5rem;
	border-radius: var(--border-rudius);
	background: var(--background-dark);
	color:var(--color-light);
	font-weight: 800;
}


@media (max-width: 768px /*tablet*/){

	.select select{
		border: 0;
		margin:0;
		padding: 0.3rem 0.6rem 0.3rem 0.6rem;
		background: var(--color-white);
		color: var(--color-foreground);
		font-size:1.3rem;
		line-height: 2rem;
	}

	.label{
		font-size:1.2rem;
		line-height: 3rem;
	}


}


.label.is-light{
	display: inline-block;
	border: 1px solid var(--color-light);
	padding-right:1.6rem;
	padding-left:1.6rem;
	font-size:1.3rem;
	line-height: 3.5rem;
	border-radius: var(--border-rudius);
	background: var(--background-dark-light);
	color:var(--color-light);
	font-weight: 800;
}

.item-list-cards{
    display: grid;
}

.compose{
	display: flex;
}


.compose > .button,
.compose > .label,
.compose > .select,
.compose > .input {
	margin:0;
}


.compose .button ,
.compose .select ,
.compose .input ,
.compose .label{
	border-radius: 0;
}
.compose .button:first-child ,
.compose .select:first-child ,
.compose .input:first-child ,
.compose .label:first-child {
	border-top-left-radius: var(--border-rudius);
	border-bottom-left-radius: var(--border-rudius);
	border-right: 0;
}

.compose .button:last-child ,
.compose .select:last-child ,
.compose .input:last-child ,
.compose .label:last-child {
	border-top-right-radius: var(--border-rudius);
	border-bottom-right-radius: var(--border-rudius);
}

.compose .select:last-child {
	border-left: 0;
}

.compose .button{
	border: var(--color-dark);
}


.compose .label{
	border: var(--color-dark);
}


.im-tag{
	border:1px solid #868686;
	line-height: 1.5rem;
	font-size:1rem;
	padding: 0rem  0.3rem  0rem  0.3rem;
	border-top-right-radius: 0.2rem;
	border-bottom-right-radius: 0.2rem;
	border-top-left-radius: 0.2rem;
	border-bottom-left-radius: 0.2rem;
	background: #979797;
	display: inline-block;
	color:#ffffff;
	font-weight: 800;
}

.im-tag i {
	font-style: normal;
	display: inline-block;
	margin-left: 0.3rem;
	margin-right: 0.3rem;
}

.im-tag[data-condition="中古"],
.im-tag.is-used{
	background: var(--tag-used);
	color: var(--tag-used-foreground);
	border: 0;
	letter-spacing: -0.01em;
}

.im-tag[data-condition="新品"],
.im-tag.is-new{
	background: var(--tag-new);
	color: var(--color-white);
	border: 0;
	letter-spacing: -0.01em;
}

.im-tag[data-condition="アウトレット"],
.im-tag.is-outlet{
	background: var(--tag-outlet);
	color:var(--color-white);
	border:0;
	letter-spacing: -0.05em;
}

.im-tag[data-condition="実物写真"],
.im-tag.is-real{
	background: var(--tag-real);
	color:var(--color-white);
	border: 0;
}


.im-tag[data-condition="360画像"],
.im-tag.is-real360{
	background: var(--tag-real);
	color:var(--color-white);
	border:0;
}

.im-tag[data-condition="送料無料"],
.im-tag.is-freeshipping{
	background: var(--tag-shippingfree);
	color:var(--color-white);
	border: 0;
}

.im-tag[data-condition="【VINTAGE】"],
.im-tag[data-condition="ヴィンテージ"],
.im-tag.is-vintage{
    background: var(--tag-vintage);
	color: var(--color-white);
	border: 0;
	letter-spacing: -0.1em;

}

.im-tag[data-condition="【VINTAGE】"] i::before,
.im-tag[data-condition="ヴィンテージ"] i::before,
.im-tag.is-vintage i::before{
	content: "ヴィンテージ";
}


.im-tag[data-condition="新品"] i::before,
.im-tag.is-new i::before{
	content: "新品";
}

.im-tag[data-condition="中古"] i::before,
.im-tag.is-used i::before{
	content: "中古";
}

.im-tag[data-condition="値下"] i::before,
.im-tag[data-condition="セール"] i::before,
.im-tag.is-sale i::before{
	content: "値下げ";
}

.im-tag[data-condition="アウトレット"] i::before,
.im-tag[data-condition="OUTLET"] i::before,
.im-tag.is-outlet i::before{
	content: "アウトレット";
}


.im-tag[data-condition="実物写真"] i::before,
.im-tag.is-real i::before{
	content: "実物写真";
}

.im-tag[data-condition="送料無料"] i::before,
.im-tag.is-freeshipping i::before{
	content: "送料無料";
}

.im-tag[data-condition="実物写真"] i::before,
.im-tag.is-real i::before{
	content: "実物写真";
}

.im-tag[data-condition="360画像"] i::before,
.im-tag.is-real360 i::before{
	content: "360度写真";
}


.im-tag.is-sale{
    background: var(--tag-sale);
	display: inline-block;
	color: var(--color-white);
	border:0;
}

.im-tag.is-outline{
    background: transparent;
	display: inline-block;
	color: var(--color-foreground)	;
	border:1px solid var(--color-foreground);
}

/* main layouts */

.grid-main-contents{
    display: grid;
    min-height: 80vh;
}

/* top-page */

.grid-main-contents.is-top{
    grid-template-columns: 1fr;
    align-items: center;
    justify-items: center;
}

.grid-main-contents.is-top .grid-item{
    width: 99.6%;
}



/*
サイドナビ有りのレイアウト
*/

@media (min-width: 768px /*tablet*/){}
@media (min-width: 1024px /*desktop*/ ){

	.grid-main-contents.area_1-4 .area-a{
		grid-column: 2/3;
		grid-row:1/2
	}
	
	.grid-main-contents.area_1-4 .area-b{
		grid-column: 1/2;
		grid-row:1/2
	}
	
	.grid-main-contents.area_1-4 .area-a{
		padding: 1rem 1.5rem;
	}
	.grid-main-contents.area_1-4 .area-b{
		padding: 1rem 1.5rem;
	}

	.grid-main-contents.area_1-4 {
		--width:1023px;
		--nav-width: 30rem;
		--grid-gap: 0.8rem;
		justify-content: center;
		grid-template-columns: var(--nav-width) calc(var(--width) - var(--nav-width)) ;
		grid-gap: var(--grid-gap);
	}
}

@media (min-width: 1216px /*widescreen*/ ){

	.grid-main-contents.area_1-4 {
		--width:1215px;
		--nav-width: 30rem;
		--grid-gap: 0.8rem;
		justify-content: center;
		grid-template-columns: var(--nav-width) calc(var(--width) - var(--nav-width)) ;
		grid-gap: var(--grid-gap);
	}
}
@media (min-width: 1408px /*fullhd*/ ){

	.grid-main-contents.area_1-4{
		--width:1407px;
		--nav-width: 30rem;
		--grid-gap: 0.8rem;
		justify-content: center;
		grid-template-columns: var(--nav-width) calc(var(--width) - var(--nav-width)) ;
		grid-gap: var(--grid-gap);
	}
	.grid-main-contents.area_1-1{
		--width:1407px;
		--grid-gap: 0.8rem;
		justify-content: center;
		grid-template-columns: var(--width) ;
		grid-gap: var(--grid-gap);
	}
	
}
.area-b .close{
	display: none;
}
.is-right-pane{
	display: block !important;
}
.is-right-pane .background{
	display: block !important;
	width: 100%;
	position: fixed;
	top:0;
	left:0;
	background: rgba(0, 0, 0, 0.5);
	width: 100vw;
	height: 100vh;
	z-index: 1001;
}
.is-right-pane .inner{
	background: #fff;
	position: fixed;
	top:0;
	right: 0;
	z-index: 1002;
	width: 80vw;
	max-width: 36rem;
	height: 100vh;
	padding: 1.6rem;
	overflow-y: auto;
}



.is-right-pane .close{
	display: block;
	position: fixed;
	z-index: 1003;
	right: 1rem;
	top:1rem
}

@media (min-width: 768px /*tablet*/){}
@media (min-width: 1024px /*desktop*/ ){}
@media (min-width: 1216px /*widescreen*/ ){}
@media (min-width: 1408px /*fullhd*/ ){}

/*
header
*/


.im-header_nav{
	display :grid;
	grid-template-columns: repeat( 12,calc(100%/12) );
	align-items: center;
	grid-template-rows: 5.2rem 5.0rem;
}
.im-header_nav.is-plain{
	display :grid;
	grid-template-columns: auto auto;
	align-items: center;
	justify-content: start;
	grid-template-rows: 6.0rem;
	column-gap: 3rem;
}

.im-header_nav.is-plain .page-title h2{
	font-size: 1.6rem;
}


.im-header_nav h1{
	margin: 0;
}

.im-header_nav-logo{
	grid-row:1/2;
	grid-column: 2/5
}

.im-header_nav-category{
	grid-row:1/2;
	grid-column:1/2
}





.im-tag{
	border:1px solid #868686;
	line-height: 1.5rem;
	font-size:1rem;
	padding: 0rem  0.2rem  0rem  0.2rem;
	border-top-right-radius: 0.2rem;
	border-bottom-right-radius: 0.2rem;
	border-top-left-radius: 0.2rem;
	border-bottom-left-radius: 0.2rem;
	background: #979797;
	display: inline-block;
	color:#ffffff;
	font-weight: 800;
}

.im-tag i {
	font-style: normal;
	display: inline-block;
	margin-left: 0.4rem;
	margin-right: 0.4rem;
}

.im-tag.is-used{
	background: var(--tag-used);
	display: inline-block;
	color:var(--tag-used-foreground);
	border: 0;
	letter-spacing: -0.01em;
}
.im-tag.is-new{
	background: var(--tag-new);
	display: inline-block;
	color: var(--color-white);
	border: 0;
}

.im-tag.is-outlet{
	background: var(--tag-outlet);
	display: inline-block;
	color:var(--color-white);
	border: 0;
}
.im-tag.is-real{
	background: var(--tag-real);
	display: inline-block;
	color:var(--color-white);
	border: 0;
}

.im-tag.is-freeshipping{
	background: var(--tag-shippingfree);
	display: inline-block;
	color: var(--color-white);
	border: 0;
}

.im-tag.is-vintage{
    background: var(--tag-vintage);
	display: inline-block;
	color: var(--color-white);
	border: 0 ;
}

.im-tag.is-sale{
    background: var(--tag-sale);
	display: inline-block;
	color: var(--color-white);
	border:0;
}

.im-border-container{
	border:1px solid var(--color-light);
	border-radius: var(--border-rudius);
	background: #f9f9fa;
	padding: 1rem 1.6rem;
	margin: 2rem 0;

}


.im-header_nav-login{
	grid-row:1/2;
	grid-column: 5/12
}

.im-header_nav-buy{
	grid-row: 2/3;
	grid-column: 1/4;
}

.im-header_nav-search{
	grid-row: 2/3;
	grid-column: 4/13;
}

.im-header_nav-location,
.im-header_nav-used{
	display: none;
}
im-header{
	transition: all ease-in-out 0.25s;
}
im-header.sticky{
	position: sticky;
	top:0;
	z-index: 1000;
}
	
/*
global menu
*/


.global-pane{
	position: fixed;
	top:0;
	left:0;
	display: block;
	z-index: 1001;
}
.global-pane-bg{
	background: rgba(0,0,0,0.5);
	height: 100vh;
	width: 100vw;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	right: 0;
	top:0;
}
.global-pane-inner{
	width: 90vw;
	background: #ffffff;
	max-width: 40rem;
	height: 100vh;
	border-left: #f1f1f1;
	padding: 0.6rem;
	box-sizing: border-box;
	overflow-y: scroll;
	position: absolute;
	top:0;
	left: 0;
	padding-bottom: 8rem;
}

.global-pane{
	width: 0;
	overflow: hidden;
}
.global-pane.active{
	width: auto;
	overflow: none;
}

.global-pane-list{
	display: grid;
	list-style: none;
	margin:0;
	grid-template-columns: repeat(2,calc( 100% / 2 - 0.2rem));
	padding: 0 0 2rem 0;
	gap:0.4rem;
}
.global-pane-list > a{
	display: grid;
	grid-template-columns: 4.6rem 1fr 2rem;
	grid-template-rows: 3.8rem;
	align-items: center;
	text-decoration: none;
	color: var(--page-link-color);
	font-size:1.2rem;
	border: 1px solid var(--color-light);
	border-radius: var(--border-rudius);
}
.global-pane-list > a::after {
	content: "\203A";
	font-size:1.1rem
}


.global-pane-list_stores > a{
	grid-template-columns: 1fr 2rem;
	grid-template-rows: 3.8rem;
	font-size: 1.1rem;
	padding-left:1rem
}
.global-pane-list_infomation > a{
	grid-template-columns: 3.2rem 1fr 2rem;
	grid-template-rows: 3.6rem;
}
.global-pane-list > a span:has(img){
	line-height: 0;
	align-self: center;
	justify-content: center;
	text-align: center;
}

.global-pane-list-image{
	height: 3.0rem;
}

.global-pane-list_stores .global-pane-list-image{
	height: 1.4rem;
}

.global-pane-h3{
	font-size: 1.6rem;
	display: grid;
	color: var(--color-foreground);
	padding: 0.6rem 0.9rem;
	grid-template-rows: 1fr 1fr;
	grid-template-columns: 4.8rem 1fr;
	line-height: 1.2em;
}
.global-pane-h3 .icon{
	grid-row: 1/3;
}
.global-pane-h3 .icon img{
	height: 2.8rem;
}
.global-pane-h3 .alpha{
	font-size: 1.2rem
}

.global-pane-sale{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr;
	align-items: center;
	justify-self: center;
}

.global-pane-sale img {
	width: 96%;
}

.global-pane-inner_head{
	background-color: var(--color-dark);
	display: grid;
	grid-template-rows: 4.6rem;
	margin: -0.6rem -0.6rem 0 -0.6rem;
	align-items: center;
	padding-left:1rem;
	color:#ffffff;
	font-weight: bold	;
}

.global-pane-inner_close-icon{
	position: absolute;
	top:0;
	right:0.1rem;
	z-index: 9999;
}
.global-pane-inner_head a{
    color:var(--color-light);
    text-decoration: none;

}
.global-pane-inner_head .global-pane-inner_head-content{
    display: grid;
    grid-template-columns: 5rem 1fr;
	justify-content: center;
	align-items: center;
}
.global-pane-inner_head .global-pane-inner_head-content > :first-child{
	text-align: center;
}
.global-pane-inner_head .global-pane-inner_head-content a{
	line-height: 1.36em;
}
.global-pane-inner_head .global-pane-inner_head-content a > *:nth-child(2){
	font-size: 1.3rem;
}
.global-pane-inner_head .global-pane-inner_head-content svg{
    fill:var(--color-light);
    width: 2.8rem;
    height: 2.8rem;
}



@media (min-width: 48em){
	.global-pane-inner_close-icon{
		left:40rem;
	}
}


.global-pane-inner_close-icon{
	cursor: pointer;
}
.global-pane-category{
	display: grid;
	grid-template-columns: 100% 0%;
	width: 100%;
	transition: all ease-in-out 0.25s;
}

.sub-menu-open{
	grid-template-columns: 0 100%;
}

.global-pane-category > div{
	overflow: hidden;
}
.global-pane-list-sub{
	display: grid;
	grid-template-columns: 1fr;
	justify-content: start;
	align-items: start;
}

.global-pane-list-sub > a {
    display: grid;
    grid-template-columns: 1fr 1rem;
	border-bottom-width: 1px;
	padding-left: 1rem;
}
.global-pane-list-sub > a::after {
	content: "\203a";
	font-size:1.2rem
}

.global-pane-list-sub > a.up-category{
    grid-template-columns: 2rem 1fr;
	align-items: center;
	font-weight: bold;
	border: 1px solid transparent;
}
.global-pane-list-sub > a.up-category::after {
	content: none;
}
.global-pane-list-sub > a.up-category::before {
	content: "\203a";
	font-size:1.2rem;
	text-align: center;
	transform: rotate(-90deg);
}

.im-header_my{
    width: 3.2rem;
    height: 3.2rem;
}
.im-header_my svg{
    width: 90%;
    height: 90%;
    fill:#515151;
}
.im-header_logout{
    width: 3.2rem;
    height: 3.2rem;
	margin-left: 0.5rem;
}
.im-header_logout svg{
    width: 90%;
    height: 90%;
    fill: var(--color-primary);
}
.im-header_qrcode {
    width: 3.2rem;
    height: 3.2rem;
    margin-left: 1rem;
}
.im-header_qrcode svg{
    width: 90%;
    height: 90%;
    fill:#515151;
}

.im-header-cart-icon{
    width: 3.2rem;
    height: 3.2rem;
    position: relative;
}
.im-header-cart-icon svg{
    width: 90%;
    height: 90%;
    fill:#515151;
}

.im-header_nav-location-icon{
    width: 3.2rem;
    height: 3.2rem;
}

.im-header_nav-location-icon svg{
    width: 90%;
    height: 90%;
    fill:#cc0001;
}


.im-header_nav-category-icon{
    width: 3.2rem;
    height: 3.2rem;
}

.im-header_nav-category-icon svg{
    width: 90%;
    height: 90%;
    fill:#515151;
}

.im-header-cart-icon .has-item-badge{
    position: absolute;
    fill:#cc0001;
    top: 0.1rem;
    right: 0.1rem;
    width: 1rem;
    height: 1rem;
}

.im-header_nav-login.is-flex{
	gap:0.1rem;
	align-items: center;
}
.im-header_my,
.im-header_nav-category-icon,
.im-header-cart-icon,
.im-header_qrcode,
.im-header_logout{
    width: 2.4rem;
    height: 2.4rem;
}
@media (min-width: 768px){

	.im-header_nav-login.is-flex{
		gap:0.4rem;
		align-items: center;
	}
	.im-header_my,
	.im-header_nav-category-icon,
	.im-header-cart-icon,
	.im-header_qrcode,
	.im-header_logout{
		width: 3.2rem;
		height: 3.2rem;
	}

}

/* p-breakpoints-lg-up */
	

@media (min-width: 768px){
	.im-header_nav{
		display :grid;
		grid-template-columns: 
			4rem
			140px 
			1fr
			7em 
			24rem
			3rem
			;

		grid-template-rows: 5.6rem; 
		align-items: center;
	}

	.im-header_nav-category{
		grid-row:1/2;
		grid-column:1/2
	}

	.im-header_nav-logo{
		grid-row:1/2;
		grid-column: 2/3
	}


	.im-header_nav-buy{
		grid-row: 1/2;
		grid-column: 4/5;
	}

	.im-header_nav-search{
		grid-row: 1/2;
		grid-column: 3/4;
	}
	.im-header_nav-login{
		grid-row:1/2;
		grid-column: 5/6
	}

	.im-header_nav-cart{
		grid-row:1/2;
		grid-column: 6/7
	}

	
}


@media (min-width: 1024px){
	.im-header_nav{
		display :grid;
		grid-template-columns: 
			4rem
			240px 
			1fr
			7em 
			7em 
			7em 
			24rem
			8rem
			;

		grid-template-rows: 6.2rem; 
		align-items: center;
	}


	.im-header_nav-category{
		grid-row:1/2;
		grid-column:1/2
	}

	.im-header_nav-logo{
		grid-row:1/2;
		grid-column: 2/3
	}


	.im-header_nav-location{
		grid-row:1/2;
		grid-column: 4/5
	}

	.im-header_nav-buy{
		grid-row: 1/2;
		grid-column: 6/7;
	}

	.im-header_nav-used{
		grid-row:1/2;
		grid-column:5/6
	}

	.im-header_nav-search{
		grid-row: 1/2;
		grid-column: 3/6;
	}
	.im-header_nav-login{
		grid-row:1/2;
		grid-column: 7/8
	}

	.im-header_nav-cart{
		grid-row:1/2;
		grid-column: 8/9
	}


}

/* p-breakpoints-lg-up */
	
@media (min-width: 1216px){
	.im-header_nav{
		display :grid;
		grid-template-columns: 
			240px 
			9.6em 
			1fr
			7em 
			7em 
			7em 
			24rem
			4rem
			;

		grid-template-rows: 6.2rem; 
		align-items: center;
	}
	.im-header_nav-logo{
		grid-row:1/2;
		grid-column: 1/2
	}


	.im-header_nav-location{
		grid-row:1/2;
		grid-column: 6/7
	}

	.im-header_nav-buy{
		grid-row: 1/2;
		grid-column: 5/6;
	}

	.im-header_nav-category{
		grid-row:1/2;
		grid-column:2/3
	}


	.im-header_nav-used{
		grid-row:1/2;
		grid-column:4/5
	}

	.im-header_nav-search{
		grid-row: 1/2;
		grid-column: 3/4;
	}
	.im-header_nav-login{
		grid-row:1/2;
		grid-column: 7/8
	}

	.im-header_nav-cart{
		grid-row:1/2;
		grid-column: 8/9
	}

	.im-header_nav-location,
	.im-header_nav-used{
		display:flex;
	}
}

/***
design
***/

.im-header_nav{
	box-sizing: border-box;
	padding: 0 0.6rem;
	border-bottom: 1px solid #f3f7f8;
}

.im-header{
	background:#fff;
}

.im-header_nav-link{
	font-weight: bold;
	font-size:1.3rem;
	text-decoration: none;
	color:#515151;
	line-height: 2.3;
	text-align:center;
}
.im-header_nav-used-tag,
.im-header_nav-kaitori-tag
{
	text-decoration: none;
	border-radius: 0.2rem;
	padding: 0.7rem 1.2rem;
	font-weight: bold;
	font-size:1.2rem;
	line-height: 1.4;
}
.im-header_nav-kaitori-tag{
	background: var(--color-primary);
	color:#fff;
}


.im-header_nav-used-tag{
	background: #ffdd46;
	color:#333333;
}

.im-header_nav-logo{
	max-width: 100%;
	height: auto;
}

.im-header_nav-search .search-modal__form{
	margin: 0 auto;
}
.im-header_nav-search .field__input{
	font-size:1.4em;
	height: 1.4em;
	border: 1px solid hsl(0, 11%, 88%);
	padding: 0.98em 0.6rem;
	color:#515151;
	margin-left:1rem;
	border-radius: 4px;
	background: #fbfdff;
}


.im-header_nav-search .search__button{
	position: absolute;
	top:0;
	right:0;
}

.im-header_nav-search .search__button svg{
    width: 100%;
    height: 100%;
}

.im-header-flush-notice{
	background: #cc001d;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 32px;
	justify-items: center;
	align-items: center;
}
.im-header-flush-notice-content{
	color:#eeeeee;
	font-size:1.2rem;
	font-weight: bold;
	height: 0;
	overflow: hidden;
}
.im-header-flush-notice-content.active{
	height:auto;
}

.im-header_nav-category .im-header_nav-link{
	display: none;
}

.im-header_nav-category .im-header_nav-link{
	display: none;
}


.im-header_nav-search{
    position: relative;
    margin:1rem;
}

.im-header_nav-search:has(.is-focus){
    position: absolute;
    top:0;
    left: 1rem;
    width: calc(100% - 4rem);
    height: 100vh;
    background-color: transparent;
	z-index: 1001;
	box-sizing: border-box;
}
.im-header_nav-search:has(.is-focus) .is-focus{
    z-index: 1002;
	position: relative;
}
.im-header_nav-search:has(.is-focus) .im-header_nav-search-background{
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	background: rgba(0,0,0,0.3);
	height: 100vh;
	z-index: 1001;
}
.im-header_nav-search form{
	position: relative;
}
.im-header_nav-search:has(.is-focus) .is-focus form{
	z-index: 1002;
}
.im-header_nav-search:has(.is-focus) .is-focus form div{
	background: rgba(255,255,255,0.8);
}


.im-header_nav-search button {
  background: transparent;
  border: 0;
  position: absolute;
}
.im-header_nav-search button.close{
	display: none;
}
.im-header_nav-search:focus-within button.close {
	display: block;
}

.im-header_nav-search button.search {
  right: 1.0rem;
  width: 4.0rem;
  height: 4.0rem;
}

.im-header_nav-search:focus-within button.search {
  right: 4.0rem;
}

.im-header_nav-search:focus-within button.close {
  top:0rem;
  right: 1.0rem;																																																																						
  width: 4.0rem;
  height: 4.0rem;
}



.im-header_nav-search button svg{
    height: 100%;
    width: 100%;
    fill:#515151;
}

.im-header_nav-search button.close svg{
    fill:rgb(173, 173, 173);
}

@media (min-width: 1408px /*tablet*/){
    .im-header_nav-search:focus-within button.search {
        right: 1rem;
    }

    .im-header_nav-search:focus-within button.close {
        display:none
    }


    .im-header_nav-search{
        margin: 1rem;
        padding: 1rem;
		padding-left: 2rem;
    }
    .im-header_nav-search:has(.is-focus){
        position: relative;
        top:0;
        left: 0;
        width: auto;
        height: auto;
        background-color: transparent;
    }



}
@media (min-width: 1024px /*desktop*/ ){
    
}
@media (min-width: 1216px /*widescreen*/ ){
    
}
@media (min-width: 1408px /*fullhd*/ ){
    
}

.im-header_nav-search input {
    border: 1px solid var(--color-light);
    font-size:1.6rem;
    padding: 1rem;
	padding-right: 6rem;
    width: 100%;
	background: rgb(249, 249, 249);
}
.im-header_nav-search input:focus {
  outline: 1px solid var(--color-primary);  
}
.im-header_nav-search form{
    margin: 0;
    padding: 0;
}


.im-header_nav-search .suggest a{
    text-decoration: none;
    margin:0.3rem;
    padding:0.2rem 0.8rem;
}
.im-header_nav-search .suggest > a::after {
    content: "\203A";
    font-size: 1.6rem;
    margin-left: 1rem;
}

.im-header_nav-link-user{
	display: grid;
	font-size: 1.2rem;
	line-height: 1.4;
}

.im-header_nav-link-user .point{
	font-size: 1.0rem;
	color : var(--color-primary)
}


@media (min-width: 90em){
	.im-header_nav{
		padding: 0 1rem;
	}
	.im-header_nav-category .im-header_nav-link{
		display: block;
	}
}

/*
* breadcrumb
*/


.im-breadcrumb-container{
	padding: 0;
	max-width: 100vw;
	overflow-y: auto;
	scrollbar-width: thin;
}

.im-breadcrumb-container ul{
	max-width: 200vw;
}



.im-breadcrumb{
	display: flex;
	flex-wrap: wrap;
    list-style: none;
    padding: 0;
	margin: 1.6rem 0.9rem;
}

@media (min-width: 1408px /*fullhd*/ ){

}

.im-breadcrumb li > a{
	text-decoration:none;
    display: flex;
	padding: 0.2rem 0.3rem
}


.im-breadcrumb li > span{
	padding: 0.2rem 0.3rem
}

.im-breadcrumb > li{
	margin-right : 0.3rem;
    display: flex;
    line-height:2rem;
    font-size:1.2rem;
}

@media (min-width:1408px) {
	.im-breadcrumb > li{
		line-height:1.6rem;
		font-size:1.3rem
	}
	.im-breadcrumb a img{
		width:28px;
		height:28px;
	}

	.im-breadcrumb{
		margin: 1.8rem 0 1.8rem 2.4rem;
	}

}

.im-breadcrumb > li::after {
  content: '\203a';
  margin-left: 6px;
  margin-right: 6px;
  color: #888888;
}

.im-breadcrumb > li:last-child::after {
  content: ' ' !;
}


@media (min-width:1400px) {
  .im-breadcrumb > li:after {
    margin-left: 12px;
    margin-right: 12px;
  }
}

.im-breadcrumb > li:last-child:after {
  content: ""; /* 最後のliの後ろには区切り文字を表示しない */
}


/*
footer
*/

.footer{
    background: rgb(32, 29, 29);
	border-top: 1px solid var(--color-light);
}
.footer .footer-site-navigation{
    background: #201d1d;
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 2rem;
    padding: 2rem 2rem;
    color:var(--color-light);
    justify-content: center;
    max-width: 1408px;
    margin: 0 auto;
}

.footer .footer-site-navigation a{
    color: var(--color-light);
	text-decoration: none;
}

.footer .footer-site-navigation a:hover{
    color: var(--color-white);
}
@media (min-width: 768px ){
    .footer .footer-site-navigation{
        grid-template-columns: repeat(2,1fr);
    }
}
@media (min-width: 1024px ){
    .footer .footer-site-navigation{
        grid-template-columns: repeat(3,3fr) 2fr;
    }
}

.footer .blog{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin: 1rem;
	gap: 1rem;
}
.footer .blog img{
    max-width: 100%;
    height: auto;
}
.footer .blog a{
	background: var(--color-white);
	line-height: 0;
	border: 1px solid var(--color-primary-light)
}

@media (min-width: 768px ){
    .footer .blog{
        grid-template-columns: 1fr;
    }
}

.footer .sns{
    display: grid;
    grid-template-columns: repeat(6,1fr);
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-top:3rem;
	margin-bottom: 3rem;
	gap: 1.6rem;
}
.footer .sns svg{
	max-width: 8rem;
}

.footer h3{
    margin:2rem 1rem 1.5rem 1rem;
    padding:0
}

.footer ul{
    margin:0;
    padding:0 0 0 3rem;
}

.footer .copy-right{
    border-top:1px solid rgb(54, 49, 49);
    text-align: center;
    padding : 1rem;
	color: var(--color-light);
}

.footer-member{
	display: grid;
	justify-content: center;
}

@media (min-width: 1408px /*fullhd*/ ){

	.footer-member{
		grid-template-columns: var(--max-column-width);
	}
}

.footer-member .footer-member-navigation{
    display: grid;
    grid-template-columns: 1fr;
	grid-auto-flow: column;
    grid-gap: 2rem;
    padding: 2rem 2rem;
    color:var(--color-light);

    justify-content: end;
	align-items: end;
    margin: 0 0 0 auto;
}
.footer-member .footer-member-navigation a{
	border-radius: var(--border-rudius);
	text-decoration: none;
	background: var(--color-white);
	padding: 1rem;
	min-width: 14rem;
	border:1px solid var(--color-light);
	text-align: center;
}

/*
product-card-component
*/


.im-products-grid{
	display: grid;
	grid-template-columns: repeat(2,1fr);
	column-gap: 0.9rem;
	row-gap: 2.2rem;
}

@media (min-width: 768px /*tablet*/){
	.im-products-grid{
		display: grid;
		grid-template-columns: repeat(3,1fr);
	}
}
@media (min-width: 1024px /*desktop*/ ){
	.im-products-grid{
		display: grid;
		grid-template-columns: repeat(3,1fr);
	}
}
@media (min-width: 1216px /*widescreen*/ ){
	.im-products-grid{
		display: grid;
		grid-template-columns: repeat(3,1fr);
	}
}
@media (min-width: 1408px /*fullhd*/ ){
	.im-products-grid{
		display: grid;
		grid-template-columns: repeat(4,1fr);
	}
}

.im-products-card {
	display: grid;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	position: relative;
}

.im-products-card{
	grid-template-rows: 18rem 2.0rem 12rem 5rem;
}

.im-products-card img{
	max-width: 15rem;
	max-height: 17rem;
}

@media (min-width: 768px /*tablet*/){

	.im-products-card{
		grid-template-rows: 26rem 2.0rem 9.6rem 4rem;
	}
	.im-products-card img{
		max-width: 23rem;
		max-height: 23rem;
	}
}
@media (min-width: 1024px /*desktop*/ ){
		
	.im-products-card{
		grid-template-rows: 26rem 2.0rem 9.6rem 4rem;
	}

	.im-products-card img{
		max-width: 22rem;
		max-height: 22rem;
	}
}
@media (min-width: 1216px /*widescreen*/ ){

	.im-products-card{
		grid-template-rows: 26rem 2.0rem 9.6rem 4rem;
	}

	.im-products-card img{
		max-width: 23rem;
		max-height: 23rem;
	}
}
@media (min-width: 1408px /*fullhd*/ ){

	.im-products-card{
		grid-template-rows: 26rem 2.0rem 9.6rem 4rem;
	}

	.im-products-card img{
		max-width: 25.5rem;
		max-height: 25.5rem;
	}

}

.im-products-card-icons{
	position: absolute;
	top: 0.2rem;
	display: flex;
	flex-direction: column;
	gap:0.3rem;
	align-items: start;
}

.im-products-card:hover {
	text-decoration: none;
}
.im-products-card .im-products-card-title{
	background: var(--background-white);
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 1.8rem;
	letter-spacing: -0.005em;
}
.im-products-card .im-products-card-title.is-soldout{
	/* text-decoration: line-through; */
}

.im-products-card figure{
	margin: 0;
	box-sizing: border-box;
	display: grid;
	justify-content: center;
	align-items: center;
}

.im-products-card-price{
	font-weight: 800;
	text-decoration: none;
}

.im-products-card-price .im-product-card-sold-out{
	display: none;
}

.im-products-card-price .is-soldout .im-product-card-sold-out{
	display: block;
}

.im-product-card-sold-out,
.im-product-sale-price{
	font-size: 2rem;
	color:var(--color-primary);
	line-height: 1rem;
}
.im-product-point{
	color:var(--color-primary-light)
}
.im-product-sale-price small{
	font-size: 1.2rem;
	color:var(--color-foreground);
}
.im-products-card-price .currency{
	font-size: 1.6rem;
	line-height: 2rem;
	letter-spacing: -0.2rem;
}
.im-products-card-price:hover{
	text-decoration: none;
}
.im-products-card .instock-shop{
	display: flex;
	align-items: center;
	justify-content: left;
}
.im-products-card .instock-shop > div{
	margin-left: auto;
}

.im-products-card-icons .im-tag{
	display: none;
}

.im-products-card-icons .im-tag.is-new { display: inline-block; }
.im-products-card-icons[data-name*="中古"] .im-tag.is-new { display: none; } /* 中古が文字列に含まれる場合は新品のアイコンを隠す */
.im-products-card-icons[data-name*="中古"] .im-tag.is-used { display: inline-block; }
.im-products-card-icons[data-name*="値下げ"] .im-tag.is-sale { display: inline-block; }
.im-products-card-icons[data-name*="アウトレット"] .im-tag.is-outlet { display: inline-block; }

.im-products-card-icons[data-name*="【Vintage】"] .im-tag.is-new ,
.im-products-card-icons[data-name*="【VINATAGE】"] .im-tag.is-new 
{ display: none; } /* Vintageが文字列に含まれる場合は新品のアイコンを隠す */

.im-products-card-icons[data-name*="【Vintage】"] .im-tag.is-vintage { display: inline-block; }
.im-products-card-icons[data-name*="【VINATAGE】"] .im-tag.is-vintage { display: inline-block; }

.im-products-card-icons[data-name*="送料無料"] .im-tag.im-tag.is-freeshipping { display: inline-block; }

.im-products-card-icons[data-name*="実物写真"] .im-tag.im-tag.is-real { display: inline-block; }
.im-products-card-icons[data-name*="360画像"] .im-tag.im-tag.is-real360 { display: inline-block; }

.shop-name[data-original-code^="03"]::before{ content: "御茶ノ水本店" }
.shop-name[data-original-code^="04"]::before{ content: "御茶ノ水本店 FINEST GUITARS"}
.shop-name[data-original-code^="05"]::before{ content: "渋谷店" }
.shop-name[data-original-code^="06"]::before{ content: "新宿店" }
.shop-name[data-original-code^="08"]::before{ content: "池袋店" }
.shop-name[data-original-code^="09"]::before{ content: "横浜店" }
.shop-name[data-original-code^="10"]::before{ content: "名古屋栄店" }
.shop-name[data-original-code^="11"]::before{ content: "梅田店" }
.shop-name[data-original-code^="12"]::before{ content: "心斎橋店" }
.shop-name[data-original-code^="20"]::before{ content: "福岡店" }
.shop-name[data-original-code^="80"]::before{ content: "WEBSHOP" }
.shop-name[data-original-code^="83"]::before{ content: "WEBSHOP" }
.shop-name[data-shop-name^="御茶ノ水本店"]::before{ content: "御茶ノ水本店" }
.shop-name[data-shop-name^="御茶ノ水本店 FINEST GUITARS"]::before{ content: "御茶ノ水本店 FINEST GUITARS"}
.shop-name[data-shop-name^="渋谷店"]::before{ content: "渋谷店" }
.shop-name[data-shop-name^="新宿店"]::before{ content: "新宿店" }
.shop-name[data-shop-name^="池袋店"]::before{ content: "池袋店" }
.shop-name[data-shop-name^="横浜店"]::before{ content: "横浜店" }
.shop-name[data-shop-name^="名古屋栄店"]::before{ content: "名古屋栄店" }
.shop-name[data-shop-name^="梅田店"]::before{ content: "梅田店" }
.shop-name[data-shop-name^="心斎橋店"]::before{ content: "心斎橋店" }
.shop-name[data-shop-name^="福岡店"]::before{ content: "福岡店" }
.shop-name[data-shop-name^="WEBSHOP"]::before{ content: "WEBSHOP" }
.shop-name[data-shop-name^="RSL"]::before{ content: "WEBSHOP" }


.prices-range button,
.prices-range .compose{
	margin-top:1rem;
}

.im-pagination{
	width: 100%;
	display: flex;
	justify-content: center;
	gap:1rem;
	margin : 4rem 0;
	font-size:1.6rem;
	flex-wrap: wrap;
}

.im-pagination > a,
.im-pagination > span{
	text-decoration: none;
	background-color: var(--color-light);
	border-radius: var(--border-rudius);
	color: var(--color-foreground);
	line-height: 3.3rem;
	min-width: 3rem;
	text-align: center;
}


.im-pagination .dot{
	border:0;
	background: none;
}

.im-pagination .current{
	background-color: var(--color-dark-light);
	color:var(--color-light)
}

.im-pagination a:hover{
	text-decoration: none;
}

.im-pagination .prev,
.im-pagination .next{
	min-width: 6rem;
}
.im-pagination .last,
.im-pagination .first{
	min-width: 8rem;
}

.im-product-cards-head{
	display: grid;
	justify-content: end;
	align-items: center;
	gap: 0.5rem ;
	border-bottom: 1px solid var(--color-light);
	margin-bottom: 2rem;
	background: var(--background-light);
	padding: 0.7rem 1.2rem;
	border-radius: var(--border-rudius);

	grid-auto-flow: column;
	grid-template-columns: 1fr;
	grid-template-rows: auto auto auto;
}


.im-product-cards-head-result{
	margin-right: auto;
	font-size: 1.6rem;
	font-weight: 800;
	line-height: 2.6rem;
	grid-column: 1/3;
}

.im-product-cards-head-selector{
	display: flex;
	font-size:1rem;
	align-items: start;
	justify-content: start;
	justify-self: end;
}
.im-product-cards-head-selector label.im-product-cards-head-selector-label{
	color:var(--color-white);
	line-height: 2.5rem;
	margin: 0;
	padding: 0;
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
	min-width: 7rem;
	font-size: 1.0rem;
	text-align: center;
	border-right: 0;
}
.im-product-cards-head-selector .im-product-cards-head-selector-select{
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	margin-left: 0;
	border-left: 0;
}
.im-product-cards-head-selector .im-product-cards-head-selector-select select{
	border: 0;
    margin: 0;
    padding: 0.3rem 0.9rem 0.4rem 0.9rem;
    background: var(--color-white);
    color: var(--color-foreground);
    font-size: 1.1rem;
	outline: 0;
}
@media (min-width: 768px /*tablet*/){

	.im-product-cards-head{
		grid-template-columns: 1fr auto auto;
		grid-template-rows: 1fr;
		padding: 0.7rem 2rem;
		gap: 1rem ;
		border-top-left-radius: 0;
	}
	.im-product-cards-head-result{
		grid-column: auto;
		line-height: 3.3rem;
	}


	.im-product-cards-head-selector label.im-product-cards-head-selector-label{
		font-size: 1.2rem;
		min-width: 8rem;
	}

	.im-product-cards-head-selector .im-product-cards-head-selector-select select{
		font-size: 1.4rem;
	}

}
@media (min-width: 1024px /*desktop*/ ){}
@media (min-width: 1216px /*widescreen*/ ){}
@media (min-width: 1408px /*fullhd*/ ){}


.im-product-cards-tab{
	display: grid;
	grid-template-columns: repeat(2,1fr);
	gap: 0.6rem;
	margin: 1rem 0;
}


.im-product-cards-tab a{
	text-decoration: none;
	border: 1px solid var(--color-light);
	padding: 0.6rem;
	background-color: #fefefe;
	line-height: 2rem;
	border-radius: 0.6rem;
	font-size: 1.1rem;
}



.im-product-cards-tab a.current{
	background-color: var(--background-dark-light);
}

.im-product-cards-tab a .hit{
	display: inline-block;
	font-size: 1.0rem;
	border-radius: 3rem;
	color:var(--color-dark);
	background: #eaedf1;
	padding: 0rem 0.3rem;
	line-height: 1.2rem;
	margin-left: 0.6rem;
}

.im-product-cards-tab a .reset{
	display: inline-block;
	font-size: 0.9rem;
	border: 1px solid #da3e3e;
	border-radius: 0.8rem;
	background:#da3e3e;
	color: #eaedf1;
	padding: 0rem 0.6rem;
	line-height: 1.4rem;
	margin-left: 0.6rem;
}


.im-product-cards-tab  input[type='checkbox'],
.im-product-cards-tab  input[type='checkbox']{
	display: none;
}
/* チェックボックスは非表示（※css-1と同じ） */

.im-product-cards-tab input[type="checkbox"] {
	display: none;
}

.im-product-cards-tab label{
	pointer-events: none;
}
/* offの表示状態 */
.im-product-cards-tab label > input + span {
    box-sizing: border-box;
    cursor: pointer;
    padding: 0.8rem 1.6rem;
    position: relative;
    width: auto;
}

.im-product-cards-tab label > input + span::before{
    position: absolute;
    top: 50%;
    left: 0.4rem;
    display: block;
    margin-top: -8px;
    width: 1.8rem;
    height: 1.8rem;
    content: '';
    background: var(--background-dark-light);
    border-radius: var(--border-rudius);
}


@media (min-width: 768px /*desktop*/ ){
	.im-product-cards-tab{
		display: flex;
		gap:0.6rem;
		padding: 1rem 0 0 0;
		margin: 0;
	}
	.im-product-cards-tab a{
		text-decoration: none;
		font-size: 1.2rem;
		border: 1px solid var(--color-light);
		padding: 0.7rem 1rem 0.7rem 1rem;
		background-color: #fefefe;
		line-height: 2rem;
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	}

	.im-product-cards-tab a .hit{
		font-size: 1.0rem;
		border-radius: 3rem;
	}
	.im-product-cards-tab a .reset{
		display: inline-block;
		font-size: 1.0rem;
		border: 1px solid #da3e3e;
		border-radius: 1rem;
		background:#da3e3e;
		color: #eaedf1;
		padding: 0rem 0.6rem;
		line-height: 1.9rem;
		margin-left: 0.6rem;
	}
}


.im-product-cards-tab label > input:checked + span::after {
    border-right: 3px solid var(--color-dark);
    border-bottom: 3px solid var(--color-dark);
    content: '';
    display: block;
    height: 1.2rem;
    left: 1.2rem;
    margin-top: -0.9rem;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 5px;
}
.single-page-content{
	background: var(--color-white);
	padding : 3rem 2rem 6rem 2rem;
}




.contents-grid{
  display: grid;
  gap:1rem;
  align-items: center;
  justify-content: center;
  margin: 1rem 0;
  font-size:1.2rem;
}
.contents-grid a{

}
.contents-grid.borderd a{
  border: 1px solid var(--color-light);
  border-radius: var(--border-rudius);
  text-decoration: none;
  text-align: center;
  justify-self: center;
  padding: 1rem;
  box-sizing: border-box;
}
.contents-grid img {
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
}
.contents-grid a{
  display: grid;
  grid-template-rows: auto;
  width: 99%;
  justify-content: center;
  text-decoration: none;
  padding: 1rem;
  box-sizing: border-box;
}
.contents-grid ul,
.contents-grid li{
  display: contents;
}
.contents-grid .more{
  border:0;
  justify-self: end;
  color:var(--page-link-color);
  cursor: pointer;

}
.contents-grid .more input{
  display: none;
}
.contents-grid .more::before{
  content: "すべて表示 + ";
}

.contents-grid:has(input:checked) .more::before{
  content: "表示を減らす - ";
}

.contents-grid.m1{ grid-template-columns: repeat(1,1fr); }
.contents-grid.m2{ grid-template-columns: repeat(2,1fr); }
.contents-grid.m3{ grid-template-columns: repeat(3,1fr); }
.contents-grid.m4{ grid-template-columns: repeat(4,1fr); }
.contents-grid.m5{ grid-template-columns: repeat(5,1fr); }
.contents-grid.m6{ grid-template-columns: repeat(6,1fr); }
.contents-grid.m1 > .more{ grid-column: span 1; }
.contents-grid.m2 > .more{ grid-column: span 2; }
.contents-grid.m3 > .more{ grid-column: span 3; }
.contents-grid.m4 > .more{ grid-column: span 4; }
.contents-grid.m5 > .more{ grid-column: span 5; }
.contents-grid.m6 > .more{ grid-column: span 6; }

.contents-grid.e1 a:nth-child(n+1){display: none;}
.contents-grid.e2 a:nth-child(n+2){display: none;}
.contents-grid.e3 a:nth-child(n+3){display: none;}
.contents-grid.e4 a:nth-child(n+4){display: none;}
.contents-grid.e5 a:nth-child(n+5){display: none;}
.contents-grid.e6 a:nth-child(n+6){display: none;}

.contents-grid.e1:has(input:checked) a:nth-child(n+1){display: block;}
.contents-grid.e2:has(input:checked) a:nth-child(n+2){display: block;}
.contents-grid.e3:has(input:checked) a:nth-child(n+3){display: block;}
.contents-grid.e4:has(input:checked) a:nth-child(n+4){display: block;}
.contents-grid.e5:has(input:checked) a:nth-child(n+5){display: block;}
.contents-grid.e6:has(input:checked) a:nth-child(n+6){display: block;}



@media (min-width: 768px /*tablet*/){
  .contents-grid.t1{ grid-template-columns: repeat(1,1fr); }
  .contents-grid.t2{ grid-template-columns: repeat(2,1fr); }
  .contents-grid.t3{ grid-template-columns: repeat(3,1fr); }
  .contents-grid.t4{ grid-template-columns: repeat(4,1fr); }
  .contents-grid.t5{ grid-template-columns: repeat(5,1fr); }
  .contents-grid.t6{ grid-template-columns: repeat(6,1fr); }
  .contents-grid.t1 > .more{ grid-column: span 1; }
  .contents-grid.t2 > .more{ grid-column: span 2; }
  .contents-grid.t3 > .more{ grid-column: span 3; }
  .contents-grid.t4 > .more{ grid-column: span 4; }
  .contents-grid.t5 > .more{ grid-column: span 5; }
  .contents-grid.t6 > .more{ grid-column: span 6; }

}
@media (min-width: 1024px /*desktop*/ ){
  .contents-grid.d1{ grid-template-columns: repeat(1,1fr); }
  .contents-grid.d2{ grid-template-columns: repeat(2,1fr); }
  .contents-grid.d3{ grid-template-columns: repeat(3,1fr); }
  .contents-grid.d4{ grid-template-columns: repeat(4,1fr); }
  .contents-grid.d5{ grid-template-columns: repeat(5,1fr); }
  .contents-grid.d6{ grid-template-columns: repeat(6,1fr); }
  .contents-grid.d1 > .more{ grid-column: span 1; }
  .contents-grid.d2 > .more{ grid-column: span 2; }
  .contents-grid.d3 > .more{ grid-column: span 3; }
  .contents-grid.d4 > .more{ grid-column: span 4; }
  .contents-grid.d5 > .more{ grid-column: span 5; }
  .contents-grid.d6 > .more{ grid-column: span 6; }

}
@media (min-width: 1216px /*widescreen*/ ){
  .contents-grid.f1{ grid-template-columns: repeat(1,1fr); }
  .contents-grid.f2{ grid-template-columns: repeat(2,1fr); }
  .contents-grid.f3{ grid-template-columns: repeat(3,1fr); }
  .contents-grid.f4{ grid-template-columns: repeat(4,1fr); }
  .contents-grid.f5{ grid-template-columns: repeat(5,1fr); }
  .contents-grid.f6{ grid-template-columns: repeat(6,1fr); }
  .contents-grid.f1 > .more{ grid-column: span 1; }
  .contents-grid.f2 > .more{ grid-column: span 2; }
  .contents-grid.f3 > .more{ grid-column: span 3; }
  .contents-grid.f4 > .more{ grid-column: span 4; }
  .contents-grid.f5 > .more{ grid-column: span 5; }
  .contents-grid.f6 > .more{ grid-column: span 6; }
}


.grid-main-contents > * {
	background-color: var(--color-white);
}
.grid-main-contents {
	justify-content: center;
}
.im-search-products-form{
	margin : 2rem 0;
}

.grid-main-contents .im-search-products{
	padding: 1rem 1rem;
}


.im-search-filter{
	box-sizing: border-box;
}
.im-search-filter .categories{
	display: grid;
}

.im-search-filter .colors,
.im-search-filter .conditions,
.im-search-filter .categories{
	letter-spacing: -0.002em;
}
.im-search-filter .brands{
	letter-spacing: -0.001em;
}


.im-search-filter .level-2{
	font-size:1.2rem;
	padding: 0.2rem;
	padding-left: 1rem;
}

.im-search-filter a{
	text-decoration: none;
	border-bottom: 1px solid var(--color-light);
	padding: 0.29rem;
}
.im-search-filter h3{
	margin-bottom: 0;
	font-size: 1.8rem;
	padding-left: 1.0rem;
	margin-top: 3rem;
}
.im-search-filter h4{
	margin-top: -0.8rem;
	text-align: right;
	border-bottom: 2px solid rgb(226, 228, 230);
	font-size: 1.4rem;
	padding-right: 0.5rem;
	line-height: 1rem;
	vertical-align: baseline;
	color:rgb(222, 226, 231);
	margin-bottom: 0.8rem;
}

.im-search-filter{
	padding-bottom:4rem;
}

.im-search-filter-footer{
	position: sticky;
	bottom: 0.6rem;
	left: 0;
	background: var(--background-dark-light);
	display: grid;
	grid-template-columns: repeat(1,1fr);
	column-gap: 1rem;
	padding: 1.6rem 1rem;
	border-bottom-left-radius: var(--border-rudius);
	border-bottom-right-radius: var(--border-rudius);
}
.im-search-filter-list{
	min-height: 5rem;
}
.im-search-filter .colors,
.im-search-filter .brands{
	max-height: 30vh;
	overflow-y:auto;
}

.im-search-filter-list{
	display: grid;
	border-bottom: 2px solid rgb(226, 228, 230);
}
.im-search-filter-list a	{
	display: flex;
	justify-content: start;
	align-items: center;
	gap:0.6rem;
	line-height: 2.3rem;
	font-size:1.3rem;
}

.im-search-filter-list a .hit{
	display: inline-block;
	font-size: 1.0rem;
	border-radius: 3rem;
	color:var(--color-dark);
	background: #eaedf1;
	padding: 0rem 0.6rem;
	line-height: 1.2rem;
	margin-left: 0.6rem;
}
.im-search-filter-list a .reset{
	display: inline-block;
	font-size: 1.2rem;
	border: 1px solid #da3e3e;
	border-radius: 0.2rem;
	color:#da3e3e;
	padding: 0rem 0.6rem;
	line-height: 1.6rem;
	margin-left: 0.6rem;
}

.im-search-filter .prices a,
.im-search-filter .shops a,
.im-search-filter .colors a,
.im-search-filter .brands a{
	display: flex;
	justify-content: start;
	font-size:1.2rem;
	gap:0.4rem;
	line-height: 2rem;
}



.im-search-filter-list.is-view-top3 a:nth-child( n + 4 ){
	display: none;
}
.im-search-filter-list.is-open.is-view-top3 a:nth-child( n + 4 ){
	display: flex;
}
.im-search-filter-list.is-view-top3::after{
	content:'... すべてを表示する \25BE';
	text-align: right;
	font-size: 1.2rem;
	display: inline-block;
	line-height: 3rem;
}

.im-search-filter-list.is-view-top3.is-open::after{
	content:'表示を減らす \25B4';
	text-align: right;
	font-size: 1.2rem;
	display: inline-block;
	line-height: 3rem;
}

@media (min-width: 1024px /*desktop*/ ){
	.im-search-filter-list a:nth-child( n + 4 ){
		display: flex !important;
	}
	.im-search-filter-list.is-view-top3::after{
		content: none !important;
	}
}

.im-search-filter  input[type='checkbox'],
.im-search-filter  input[type='checkbox']{
	display: none;
}
/* チェックボックスは非表示（※css-1と同じ） */

.im-search-filter input[type="checkbox"] {
	display: none;
}


.im-search-filter label{
	pointer-events: none;
}
/* offの表示状態 */
.im-search-filter label > input + span {
    box-sizing: border-box;
    cursor: pointer;
    padding: 0.8rem 1.6rem;
    position: relative;
    width: auto;
}

.im-search-filter label > input + span::before{
	position: absolute;
    top: 50%;
    left: 0.4rem;
    display: block;
    margin-top: -8px;
    width: 1.8rem;
    height: 1.8rem;
    content: '';
    background: var(--background-dark-light);
    border-radius: var(--border-rudius);
}

.im-search-filter label > input:checked + span::after {
    border-right: 3px solid var(--color-dark);
    border-bottom: 3px solid var(--color-dark);
    content: '';
    display: block;
    height: 1.2rem;
    left: 1.2rem;
    margin-top: -0.9rem;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 5px;
}

.im-search-filter .colors label > input + span::before{
	top: 42%;
    border-radius: 3rem;
	width: 1.9rem;
	height: 1.9rem;
	border:2px solid var(--color-white)
}
.im-search-filter .colors label > input:checked + span::before{
	border:2px solid var(--color-light)
}

.im-search-filter .colors label > input:checked + span::after {
    border-right: 3px solid var(--color-dark-light);
    border-bottom: 3px solid var(--color-dark-light);
    content: '';
    display: block;
    height: 1.4rem;
    left: 1.4rem;
    margin-top: -0.9rem;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 0.4rem;
}
.im-search-filter .condition-tag{
	margin-left: auto;
}

.im-search-filter .colors label > input + span[data-color='イエロー']::before,
.im-search-filter .colors label > input + span.yellow::before{background-color: rgb(255, 236, 65);}
.im-search-filter .colors label > input + span[data-color='オレンジ']::before,
.im-search-filter .colors label > input + span.orange::before{background-color: rgb(255, 179, 65);}
.im-search-filter .colors label > input + span[data-color='グラフィック']::before,
.im-search-filter .colors label > input + span.grafic::before{background-color: rgb(133, 115, 93);}
.im-search-filter .colors label > input + span[data-color='グリーン']::before,
.im-search-filter .colors label > input + span.green::before{background-color: rgb(72, 219, 80);}
.im-search-filter .colors label > input + span[data-color='グレー']::before,
.im-search-filter .colors label > input + span.grey::before{background-color: rgb(172, 170, 153);}
.im-search-filter .colors label > input + span[data-color='ナチュラル']::before,
.im-search-filter .colors label > input + span.natunal::before{background-color: rgb(255, 229, 144);}
.im-search-filter .colors label > input + span[data-color='パープル']::before,
.im-search-filter .colors label > input + span.purple::before{background-color: rgb(156, 76, 223);}
.im-search-filter .colors label > input + span[data-color='ピンク']::before,
.im-search-filter .colors label > input + span.pink::before{background-color: rgb(231, 87, 188);}
.im-search-filter .colors label > input + span[data-color='ブラウン']::before,
.im-search-filter .colors label > input + span.brown::before{background-color: rgb(212, 150, 68);}
.im-search-filter .colors label > input + span[data-color='ブラック']::before,
.im-search-filter .colors label > input + span.black::before{background-color: rgb(22, 22, 22);}
.im-search-filter .colors label > input + span[data-color='ブルー']::before,
.im-search-filter .colors label > input + span.blue::before{background-color: rgb(47, 120, 255);}
.im-search-filter .colors label > input + span[data-color='ブロンド']::before,
.im-search-filter .colors label > input + span.blond::before{background-color: rgb(255, 252, 229);	border:2px solid var(--color-light)}
.im-search-filter .colors label > input + span[data-color='ホワイト']::before,
.im-search-filter .colors label > input + span.white::before{background-color: rgb(255, 255, 251);	border:2px solid var(--color-light)}
.im-search-filter .colors label > input + span[data-color='レッド']::before,
.im-search-filter .colors label > input + span.red::before{background-color: rgb(255, 65, 65);}
.im-search-filter .colors label > input + span[data-color='その他カラー']::before,
.im-search-filter .colors label > input + span.other::before{background-color: rgb(104, 104, 104);}

.im-search-filter .colors label > input + span[data-color='メタリック']::before,
.im-search-filter .colors label > input + span.metallic::before{
	border:2px solid var(--color-light);
	background: #ededed;
	background: linear-gradient(134deg,rgba(237, 237, 237, 1) 0%, rgba(247, 247, 247, 1) 58%, rgba(226, 226, 226, 1) 44%, rgba(179, 179, 179, 1) 56%, rgba(43, 36, 7, 1) 100%);
}
.im-search-filter .colors label > input + span[data-color='サンバースト']::before,
.im-search-filter .colors label > input + span.sunburst::before{
	background: #ffe596;
	background: linear-gradient(134deg,rgba(255, 229, 150, 1) 0%, rgba(242, 130, 31, 1) 26%, rgba(189, 105, 25, 1) 61%, rgba(43, 36, 7, 1) 100%);
}
.im-search-filter .colors label > input + span[data-color='スパークル']::before,
.im-search-filter .colors label > input + span.sparkle::before{background-color: rgb(239, 219, 255);}

.im-search-filter .colors label > input + span[data-color='ゴールド']::before,
.im-search-filter .colors label > input + span.gold::before{
	background: #f0b607;
	background: linear-gradient(134deg, rgba(240, 182, 7, 1) 0%, rgba(255, 229, 150, 1) 75%, rgba(247, 205, 77, 1) 76%, rgba(240, 182, 7, 1) 100%);
}

.im-search-filter-button.is-fixed{
	position: fixed;
	top:0;
	left:0;
	z-index: 998;
	width: 100vw;
	padding: 1rem;
	background: rgba(255, 255, 255,0.8);
	box-sizing: border-box;
}
.im-search-filter-button.is-fixed .button{
	margin-top:0;
	width: 100%;
}


.prices-range {
	margin-top: 1rem;
	padding: 1rem;
	box-sizing: border-box;
	flex-direction: column;

}
.prices-range {
	padding: 0 1rem;
	box-sizing: border-box;
	flex-direction: column;
}

.prices-range .label{
	width: 6rem;
	border-top-left-radius: var(--border-rudius);
    border-bottom-left-radius: var(--border-rudius);
}


.prices-range .label.range{
	width: auto;
	font-size: 3rem;
	line-height: 2rem;
	padding:0;
	background: transparent;
	color:var(--background-dark)
}


.prices-range .input{
	width: 12rem;
}


@media (min-width: 1024px /*desktop*/ ){
	.im-search-filter-footer{
		margin-left:-1.2rem;
		margin-right:-1.6rem;
	}
}
.im-keyword-search-form{
	width: 100%;
}
.im-keyword-search-form input{
	width:  calc(100% - 17rem) ;
}
.im-keyword-search-form button{
	width: 17rem;
}
.im-search-filter-button a.button{
	width: 100%;
	margin-top:1rem;
	margin-left: auto;
	background: var(--color-primary);
	color:var(--color-white);

}
.im-search-filter-button a.button .icon svg{
	fill:var(--color-white) !important
}

@media (max-width: 1023px /*desktop*/ ){
	.im-search-filter{
		display: none;
	}
}

@media (min-width: 1024px /*desktop*/ ){
	.im-search-filter-button{
		display: none;
	}
	.im-keyword-search-form{
		width: 100%;
		max-width: 80%;
	}

	.im-keyword-search-form input{
		width:  calc(100% - 22rem) ;
	}
	.im-keyword-search-form button{
		width: 22rem;
	}
}

.im-search-filter-list:empty{
	display: none;
}
h4:has(~div.im-search-filter-list:empty){
	display: none;
}

h3:has(~div.im-search-filter-list:empty){
	display: none;
}
div.im-search-filter-list:empty+.prices-range{
	display: none;
}