@charset "utf-8";
:root{
	/* フォントベース */
	--ff-base: var(--ff-zenkaku);
}
@media screen and (min-width: 768px){
  body{
    padding-top: 115px;
  }
}
/* ■■■■■■■■■■■■■■■■■■■■■■header■■■■■■■■■■■■■■■■■■■■■■ */
@media screen and (min-width: 1151px){
  .hd-guideLink{
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    margin-right: var(--spc-15);
  }
}
@media screen and (min-width: 768px) and (max-width: 1150px){
  .hd-guideLink{
    display: none;
  }
}
@media screen and (min-width: 768px){
  .hd-navContainer{
    display: flex;
    align-items: center;
  }
  .hd-nav{
    width: fit-content;
    margin-right: var(--spc-20);
  }
  .hd-nav li{
    height: 45px;
    display: flex;
    align-items: center;
  }
  .hd-guideLink li a{
    font-family: var(--ff-serif);
    color: var(--c-blue-700);
    font-size: var(--fz-10);
    display: block;
  }
  .g-userContainer{
    flex: 1;
  }
}


/* -----------------展開メニュー----------------- */
.hd-dropdown{
	width: var(--inner-w);
	max-width: 970px;
	position: absolute;
	--this-padding-top: clamp( 35px, 4vw, 28px);
	padding-top: var(--this-padding-top);
	top: calc(118% - var(--this-padding-top));
	right: 0;

	pointer-events: none;
	visibility: hidden;
	opacity: 0;
	z-index: -1;
	transition: .3s;
}
.hd-dropdown.is-show{
	pointer-events: auto;
	visibility: visible;
	opacity: 1;
	z-index: 99;
}
.hd-dropdown--thoughts{
  width: fit-content;
  right: unset;
  left: 50%;
}
.hd-dropdown--thoughts .g-expandMenu{
  padding: 20px;
  border-radius: 20px;
}
.hd-thoughts{
  display: grid;
  gap: 5px;
}
.hd-thoughts li a{
  font-size: var(--fz-14);
  font-family: var(--ff-serif);
  color: var(--c-blue-700);
  padding-left: 12px;
  position: relative;
  display: block;
}
.hd-thoughts li a::before{
  content: '';
  background-color: var(--theme-c-secondary);
  width: 5px;
  aspect-ratio: 1;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}
@media screen and (min-width: 1351px){
  .hd-dropdown--thoughts{
    left: 52%;
  }
}
@media screen and (min-width: 1201px) and (max-width: 1350px){
  .hd-dropdown--thoughts{
    left: 44%;
  }
}
@media screen and (min-width: 951px) and (max-width: 1200px){
  .hd-dropdown--thoughts{
    left: 48%;
  }
}
@media screen and (max-width: 950px){
  .hd-dropdown--thoughts{
    left: 48%;
  }
}


.g-expandMenu .g-searchForm__form{
	width: unset;
	max-width: 700px;
}
@media screen and (min-width: 768px){
	.g-expandMenu{
		box-shadow: var(--bxsd-default);
		background-color: var(--c-white);
		padding: var(--spc-50) var(--spc-30);
		border-radius: 40px;
		max-height: calc(100vh - 140px);
		overflow-y: scroll;
	}
}
@media screen and (max-width: 767px){
	.g-expandMenu{
		width: var(--inner-w);
		margin-inline: auto;
	}
}
.g-advancedSearch .g-searchForm__hotword{
  position: relative;
}
.g-advancedSearch .g-searchForm__hotword::after{
  content: "";
  display: inline-block;
  background: var(--repeat-line-sm) repeat-x bottom left / 8px;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.g-advancedSearch .g-searchForm__hotword li a{
	background-color: var(--c-beige-050);
}
@media (hover: hover){
	.g-advancedSearch .g-searchForm__hotword li a:hover{
		color: var(--txt-c-base);
		opacity: 0.7;
	}
}
.g-advancedSearch__form__select select,
input[type="text"].g-advancedSearch__form__keyword{
	min-height: 44px;
	border: 1px solid var(--c-gray-250);
	width: 100%;
}
input[type="text"].g-advancedSearch__form__keyword{
	border-radius: 22px;
}
.g-advancedSearch__form__select{
	position: relative;
}
.g-advancedSearch__form__select::after{
	content: "";
	display: inline-block;
	--this-mask: var(--data-icon-slide-arrow) no-repeat center center / 100%;
	mask: var(--this-mask);
	-webkit-mask: var(--this-mask);
	background-color: var(--txt-c-base);
	aspect-ratio: 1;
	width: 10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotate(-90deg);
	right: 15px;
	pointer-events: none;
}
.g-advancedSearch__form__color{
	display: grid;
}
.g-advancedSearch__form__stock{
  width: fit-content;
  margin: 0 auto 10px;
}
.g-advancedSearch__form__color li,
.g-advancedSearch__form__size li,
.g-advancedSearch__form__stock{
	position: relative;
}
.g-advancedSearch__form__color input[type="checkbox"],
.g-advancedSearch__form__size input[type="checkbox"],
.g-advancedSearch__form__stock input[type="checkbox"]{
	position: absolute;
	white-space: nowrap;
	border: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	overflow: hidden;
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
}
.g-advancedSearch__form__color i{
	display: block;
	aspect-ratio: 1/1;
	border-radius: 50%;
	overflow: hidden;
	position: relative;
}
.g-advancedSearch__form__color i[style="background-color: var(--color-chip-white);"],
.g-advancedSearch__form__color i[style="background-color: var(--color-chip-ivory);"]{
	border: 1px solid var(--c-gray-300);
}
.g-advancedSearch__form__color i::after{
	content: "";
	display: inline-block;
	background: var(--c-gray-300);
	--this-mask: var(--data-icon-color-check) no-repeat center center / 100%;
	mask: var(--this-mask);
	-webkit-mask: var(--this-mask);
	width: 20px;
	aspect-ratio: 1/1;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-10deg);
	opacity: 0;
}
.g-advancedSearch__form__color input[type="checkbox"]:checked + label i::after{
	opacity: 1;
}
.g-advancedSearch__form__color span{
	display: block;
	text-align: center;
	font-size: var(--fz-10);
	letter-spacing: 0px;
	white-space: nowrap;
}
.g-advancedSearch__form__size{
	display: grid;
}
.g-advancedSearch__form__size label{
	display: block;
	background-color: var(--c-white);
	letter-spacing: 0px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: 1px solid var(--c-gray-250);
}
.g-advancedSearch__form__size input[type="checkbox"]:checked + label{
	background-color: var(--c-beige-050);
}
.g-advancedSearch__form__stock label{
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 11px;
}
.g-advancedSearch__form__stock label span{
	display: inline-block;
	aspect-ratio: 1/1;
	border: 1px solid var(--txt-c-base);
	background-color: var(--c-white);
	width: 20px;
	position: relative;
}
.g-advancedSearch__form__stock label span::after{
	content: "";
	display: inline-block;
	background: var(--c-red-500);
	--this-mask: var(--data-icon-color-check) no-repeat center center / 100%;
	mask: var(--this-mask);
	-webkit-mask: var(--this-mask);
	width: 20px;
	aspect-ratio: 1/1;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
}
.g-advancedSearch__form__stock input[type="checkbox"]:checked + label span::after{
	opacity: 1;
}
@media (hover: hover){
	.g-advancedSearch__form__color label:hover,
	.g-advancedSearch__form__size label:hover,
	.g-advancedSearch__form__stock label:hover{
		cursor: pointer;
	}
	.g-advancedSearch__form__color label i::after{
		transition: .1s;
	}
	.g-advancedSearch__form__color label:hover i::after{
		opacity: 0.7;
	}
}
@media screen and (min-width: 768px){
	.g-advancedSearch .g-searchForm__hotword{
		justify-content: center;
		padding-block: var(--spc-20) var(--spc-30);
		margin-bottom: var(--spc-30);
	}
	.g-advancedSearch__form{
		padding-inline: var(--spc-40);
	}
	.g-advancedSearch__item{
		display: grid;
		grid-template-columns: repeat(2,1fr);
		gap: var(--spc-30) var(--spc-40);
	}
	.g-advancedSearch__item dt{
		font-weight: 500;
		margin-bottom: 10px;
	}
	.g-advancedSearch__form__color{
		grid-template-columns: repeat(7,1fr);
		gap: 10px;
	}
	.g-advancedSearch__form__color i{
		width: 85%;
		margin: 0 auto;
	}
		.g-advancedSearch__form__size{
		grid-template-columns: repeat(3,1fr);
		gap: 10px 5px;
	}
	.g-advancedSearch__form__size label{
		font-size: var(--FZ_11);
	}
	.g-advancedSearch__form__size label{
		height: 40px;
	}
}
@media screen and (max-width: 767px){
	.g-advancedSearch .g-searchForm__hotword{
		overflow-x: auto;
		padding-block: 15px 20px;
		margin-bottom: 20px;
	}
	.g-advancedSearch__item{
		display: grid;
		row-gap: 25px;
	}
	.g-advancedSearch__item dt{
		font-weight: 500;
		margin-bottom: 7px;
		font-size: 14px;
	}
	.g-advancedSearch__form__color{
		grid-template-columns: repeat(6,1fr);
		gap: 15px 10px;
	}
	.g-advancedSearch__form__color i{
		width: 90%;
		margin: 0 auto;
	}
	.g-advancedSearch__form__color span{
		font-size: 9px;
		letter-spacing: 0;
	}
	.g-advancedSearch__form__size{
		grid-template-columns: repeat(4,1fr);
		gap: 5px;
	}
	.g-advancedSearch__form__size label{
		font-size: 12px;
	}
	.g-advancedSearch__form__size label{
		height: 30px;
	}
}

/* ----------------------ヘッダーカテゴリー----------------- */
.hd-category{
	max-width: 855px;
	margin-inline: auto;
}
.hd-category dt{
	font-family: var(--ff-serif);
	font-size: var(--fz-20);
	margin-bottom: 15px;
}
.hd-category dd+dt{
	margin-top: var(--spc-40);
}
.hd-category__link .g-imageLink{
	--grid-cols-pc: 5;
  --grid-gap-pc: 15px;
}
.hd-category__link .g-imageLink li a span{
  letter-spacing: 0.05em;
}
.fn-menu__lv2 .g-imageLink li a::before,
.fn-menu__lv2 .g-imageLink li a::after{
  aspect-ratio: 4/3;
  background-size: cover;
}
/* ハンバーガー */
.fat-nav{
  top: 0;
  left: 0;
  z-index: 996;
  position: fixed;
  display: none;  
  width: 100%;
  height: 100%;
  background: #fff;   
  transform: scale(1);
  transition-property: transform;
  transition-duration: 0.4s;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  --fat-nav-gap: 40px;
}
.fat-nav__wrapper {
  height: 100%;
  max-width:1100px;
  box-sizing: border-box;
}
.fat-nav.active {
  transform: scale(1);
}
.fn-container{
	padding-bottom: calc( var(--g-user-height) + 40px);
}
.fn-logo{
	width: var(--inner-w);
	margin-inline: auto;
	padding-block: 15px 30px;
}
.fn-logo img{
	width: 90px;
}
.fat-nav .formReset select{
  width: 100%;
}
.fat-nav .formReset input[type="text"]{
	padding: 10px 15px;
	min-height: 44px;
  width: 100%;
}
.fat-nav--menu .g-searchForm__hotword{
	gap: 7px 5px;
}
.fat-nav--menu .g-searchForm__hotword{
  margin-bottom: 0;
  padding-bottom: 0;
}
.fat-nav--menu .g-searchForm__hotword::after{
  content: none;
}
.fat-nav .g-searchForm__hotword li a{
	font-size: 11px;
	padding: 3px 8px;
	letter-spacing: 0;
}
.fn-user{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  border: 1px solid var(--bd-c-gray);
  margin-block: 30px;
}
.fn-user li{
  position: relative;
}
.fn-user li::after{
  content: "";
  display: inline-block;
  background-color: var(--bd-c-gray);
  height: calc(100% - 20px);
  width: 1px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.fn-user li a{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  font-size: 14px;
  gap: 10px;
}
.fn-user li a[style*="--this-icon"]::before{
  content: "";
  display: inline-block;
  --this-mask: var(--this-icon) no-repeat center center / 100%;
  mask: var(--this-mask);
  -webkit-mask: var(--this-mask);
  background-color: var(--txt-c-base);
  aspect-ratio: 1;
  width: 18px;
}
.fn-menu__lv2{
  display: none;
  padding: 10px 10px 20px;
}
.fn-menu__lv2 .g-imageLink{
  --grid-cols-sp: 3;
  gap: 20px 10px;
}
.fn-menu__lv2 .g-imageLink li a::before,
.fn-menu__lv2 .g-imageLink li a::after{
  border-radius: 3px;
}
.fn-menu__lv2 .g-imageLink li a span{
  font-size: 11px;
  letter-spacing: 0;
}
.fn-menuContainer{
  padding-block: 10px;
}
.fn-menu > li{
  position: relative;
}
.fn-menu > li:not(:last-child)::after{
  content: "";
  display: inline-block;
  background: var(--repeat-line-sm) repeat-x bottom left / 8px;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.fn-menu__lv1{
  display: block;
  padding: 10px;
  font-size: 14px;
  position: relative;
}
.fn-menu__lv1::after{
  content: "";
  display: inline-block;
  --this-mask: var(--data-icon-dropdown) no-repeat center center / 100%;
  mask: var(--this-mask);
  -webkit-mask: var(--this-mask);
  aspect-ratio: 1 / 1;
  width: 14px;
  background-color: var(--theme-c-primary);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: .3s;
  right: 15px;
}
p.fn-menu__lv1.is-active::after{
  transform: translateY(-50%) rotate(180deg);
}
a.fn-menu__lv1::after{
  transform: translateY(-50%) rotate(-90deg);
}
.fn-history{
  margin-top: var(--fat-nav-gap);
}
.fn-history:not(:has(.fr3-item)){
  display: none;
}
[data-frame-id="fn_history_list"] .fr3-productListStatic{
  overflow-x: scroll;
  overflow-y: hidden;
  padding-left: var(--sp-scroll-padding-left) !important;
  -ms-overflow-style: none;
  scrollbar-width: none;
  display: flex;
  gap: 0px;
}
[data-frame-id="fn_history_list"] .fr3-productListStatic::-webkit-scrollbar{
  display: none;
}
[data-frame-id="fn_history_list"] .fr3-productListStatic .fr3-item{
  --this-width: 90px;
  min-width: var(--this-width);
  max-width: var(--this-width);
	flex: 0 0 auto;
	margin-right: 5px;
}
[data-frame-id="fn_history_list"] :is(
  .fr3-item__productName,
  .fr3-item__productPrice
){
  display: none;
}
.fn-guide{
  margin-block: var(--fat-nav-gap);
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 10px 5px;
}
.fn-guide li a{
  font-size: 12px;
  letter-spacing: 0;
}
.fn-end{
  padding-block: var(--fat-nav-gap) calc( var(--g-user-height) + 20px);
}
.fn-end .ec-ft-sns{
  margin-top: 30px;
}
.fn-end .ec-ft-contact{
  margin-inline: auto;
}
/* ■■■■■■■■■■■■■■■■■■■■■■footer■■■■■■■■■■■■■■■■■■■■■■ */
.ec-ft-info{
  display: grid;
  background-color: var(--c-white);
  border-radius: 30px;
}
.ec-ft-hours dl{
  font-family: var(--ff-serif);
}
.ec-ft-hours dt{
  width: fit-content;
  border-bottom: 1px solid var(--theme-c-secondary);
}
.ec-ft-hours small{
  display: block;
  font-size: var(--fz-12);
  letter-spacing: 0;
  margin-top: var(--spc-30);
  white-space: nowrap;
}
.ec-ft-copy{
  font-family: var(--ff-serif);
  font-size: var(--fz-12);
  letter-spacing: 0;
}
@media screen and (min-width: 768px) and (max-width: 1000px){
  .ec-ft-link:first-child{
    display: none;
  }
}
@media screen and (min-width: 901px){
  .ec-ft-terms{
    margin-inline: auto var(--spc-50);
  }
}
@media screen and (min-width: 768px) and (max-width: 900px){
  .ec-ft-bottom{
    justify-content: center;
    gap: 20px 30px;
  }
  .ec-ft-terms{
    order: 1;
    margin-inline: 0;
  }
  .ec-ft-sns{
    order: 2;
  }
  .ec-ft-copy{
    order: 3;
    width: 100%;
    text-align: center;
  }
}
@media screen and (min-width: 768px){
  .ec-ft-body{
    padding-block: var(--spc-90);
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--spc-75);
  }
  .ec-ft-info{
    padding: var(--spc-50) var(--spc-25) var(--spc-20) var(--spc-25);
    gap: var(--spc-35);
  }
  .ec-ft-hours dl{
    font-size: var(--fz-14);
  }
  .ec-ft-hours dt{
    margin-bottom: 5px;
  }
  .ec-ft-hours dd:not(:last-child){
    margin-bottom: var(--spc-20);
  }
  .ec-ft-nav{
    display: flex;
    justify-content: space-between;
    position: relative;
  }
  .ec-ft-link{
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  .ec-ft-link li a{
    font-size: var(--fz-14);
  }
  .ec-ft-contact{
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .ec-ft-bottom{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-bottom: 20px;
  }
  .ec-ft-terms{
    display: flex;
    align-items: center;
    gap: var(--spc-30);
  }
  .ec-ft-terms li a{
    font-size: var(--fz-14);
  }
  .ec-ft-sns{
    gap: var(--spc-20);
  }
  .ec-ft-sns li a{
    width: 28px;
  }
}
@media screen and (max-width: 767px){
  .ec-ft-body{
    padding-block: var(--sec-spc);
  }
  .ec-ft-info{
    padding: 30px;
    gap: 30px;
    width: 280px;
    margin-inline: auto;
  }
  .ec-ft-hours dl{
    font-size: 14px
  }
  .ec-ft-hours dt{
    margin-bottom: 5px;
  }
  .ec-ft-hours dd:not(:last-child){
    margin-bottom: 20px;
  }
  .ec-ft-bottom{
    display: grid;
    padding-bottom: calc(20px + var(--g-user-height));
  }
  .ec-ft-sns{
    order: 1;
    gap: 20px;
  }
  .ec-ft-sns li a{
    width: 33px;
  }
  .ec-ft-terms{
    order: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-block: 20px;
  }
  .ec-ft-terms li a{
    font-size: 10px;
  }
  .ec-ft-copy{
    order: 3;
    text-align: center;
  }
}
/* ■■■■■■■■■■■■■■■■■■■■■■wp-news■■■■■■■■■■■■■■■■■■■■■■ */
.wp-news > article:not(:last-child){
  background: var(--repeat-line-sm) repeat-x bottom left / 8px;
}
.wp-news__body{
  display: grid;
}
.wp-news__tag :is(a,span){
  display: block;
  background-color: var(--c-white);
  border-radius: 11px;
  text-align: center;
}
.wp-news__txt a{
  display: block;
  overflow: hidden;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
@media screen and (min-width: 768px){
  .wp-news > article:not(:last-child){
    padding-bottom: var(--spc-20);
    margin-bottom: var(--spc-20);
  }
  .wp-news__body{
    grid-template-columns: auto auto auto;
    justify-content: flex-start;
    align-items: center;
    gap: var(--spc-20);
  }
  .wp-news__date{
    font-size: var(--fz-14);
  }
  .wp-news__tag :is(a,span){
    font-size: var(--fz-12);
    width: 80px;
    padding-block: 3px;
  }
  .wp-news__txt a{
    font-size: var(--fz-14);
  }
}
@media screen and (max-width: 767px){
  .wp-news > article:not(:last-child){
    padding-bottom: 15px;
    margin-bottom: 15px;
  }
  .wp-news__body{
    grid-template-columns: auto 1fr;
    gap: 2px 10px;
  }
  .wp-news__txt{
    grid-column: span 2;
  }
  .wp-news__date{
    font-size: 12px;
  }
  .wp-news__tag :is(a,span){
    font-size: 10px;
    width: 70px;
    padding-block: 2px;
  }
  .wp-news__txt a{
    font-size: 12px;
  }
}