@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap');
.i_link {
	text-indent: 120%;
	white-space: nowrap;
	overflow: hidden;
}
.PC {display: inherit;}
.SP {display: none;}

/*RESET*/
.toparea,
.toparea *,
.toparea *::before,
.toparea *::after {
  box-sizing: border-box;
	margin: 0;
	font-size: 0.909vw; /*defaultFontsize / maxWidth * 100*/
}
.toparea,
.toparea * {
	color: #333;
	font-family: var(--font-default);
}
.toparea input,
.toparea button {
  font: inherit;
}
/* buttonのスタイルを打ち消し */
.toparea button {
  padding: 0;
  background: none;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
/* inputのスタイルを打ち消し */
.toparea input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    border-radius: 0;
    outline: none;
    background: transparent;
}
/*RESET*/

:root {
	--font-default: 'Noto Sans JP', sans-serif;
	--font-Mincho:  "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

}

html {
	scrollbar-width: none; /*Firefox対応のスクロールバー非表示コード*/
	-ms-overflow-style: none;/*Internet Explore対応のスクロールバー非表示コード*/
}
html::-webkit-scrollbar {
	display: none; /*Google Chrome、Safari、Microsoft Edge対応のスクロールバー非表示コード*/
}
  /*deviceWidth 750px 以上の時 全体のフォントサイズ 10px に固定*/
  @media screen and (min-width: 1100px) {
		.toparea,
		.toparea *,
		.toparea *::before,
		.toparea *::after {
			font-size: 10px;
		}
  }
.toparea img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.toparea picture {
	display: inline-block;
	vertical-align: bottom;
}
.toparea ul[class] {
	list-style: none;
}

.toparea a[class] {
	display: inline-block;
	transition: opacity 0.12s;
}
	.toparea a[class]:hover {
		opacity: 0.8;
	}

/*--------------------
No1*/

/*--No2*/

/*No3*/
.content {
	max-width: 1100px;
	margin: 0 auto;
}

header {}
header.custom_header {
	position: static;
	width: auto;
	margin: 0;
	padding: 0;
	background: none;
	text-align: center;
}
.hwrap {
	display: flex;
		flex-direction: column;
}
.hwrap .status {
		order: 1;
	padding: 0.9em;
	text-align: right;
	background: #c79e70;
}
	.hwrap .status span {
		color: #fff;
		font-size: 1.4em;
		letter-spacing: 0.1em;
		line-height: 1;
	}
	.hwrap .status .userrank {
		margin-left: 1em;
	}
.hwrap .js-fix {
		order: 2;
	background: #f7ead9;
  position: relative;
}
	.hwrap .js-fix .content {
		display: grid;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			grid-template-rows: max-content max-content;
			gap: 0px 0px;
			grid-template-areas:
				"logo menu1 search shopmenu"
				"menu2 menu2 menu2 menu2";
			align-items: center;
	}
	.js-fix .logo { grid-area: logo; }
	.js-fix .menu1 { grid-area: menu1; }
	.js-fix .search { grid-area: search; }
	.js-fix .shopmenu { grid-area: shopmenu; }
	.js-fix .menu2 { grid-area: menu2; }
.hwrap .js-fix .logo a {
	display: block;
	width: 14em;
	height: 6.6em;
	background: url("../images/h_logo_2x.png") no-repeat center;
	background-size: 100%;
}
.hwrap .js-fix .menu1 {
	display: flex;
	width: 48em;
	margin-left: 2em;
  margin-top: 1.6em;
}
.hwrap .js-fix .menu1 .menu1_list,
.hwrap .js-fix .menu1 .menu1_list li{
  list-style: none;
  padding: 0;
}
.hwrap .js-fix .menu1 .menu1_list {
  display: flex;
}
.hwrap .js-fix .menu1 .menu1_list .i_link {
	display: block;
	width: 10em;
	height: 5em;
	background: no-repeat center;
	background-size: auto 1.6em;
  border-bottom: solid 0.3em #f7ead9;
}
.hwrap .js-fix .menu1 .menu1_list .i_link:hover,
.hwrap .js-fix .menu1 .menu1_list .i_link.is-open {
  border-bottom: solid 0.3em #c79e70;
}

.hwrap .js-fix .menu1 .i_link.ITEM {background-image: url("../images/h_m1_item.png");}
.hwrap .js-fix .menu1 .i_link.BRAND {background-image: url("../images/h_m1_brand.png");}
.hwrap .js-fix .menu1 .i_link.GUIDE {background-image: url("../images/h_m1_guide.png");}
.hwrap .js-fix .menu1 .i_link.CONTACT {background-image: url("../images/h_m1_contact.png");}
.hwrap .js-fix .menu1 .i_link.MEMBER {background-image: url("../images/h_m1_member.png");}
.hwrap .js-fix .menu1 .i_link.SHOPLIST {background-image: url("../images/h_m1_shoplist.png");}

.hwrap .js-fix .search {
	margin-left: 16.4em;
	padding: 0;
	background: none;
}
.hwrap .js-fix .search .box {
	position: relative;
	display: flex;
		justify-content: center;
		align-items: center;
	width: 20em;
	height: 4em;
	padding: 0 5em 0 2em;
	background: #fff;
	border-radius: 20em;
}
.hwrap .js-fix .search .box .search_none {
  display: none;
}
	.hwrap .js-fix .search .box input {
		width: 100%;
		font-size: 1.6em;
	}
	.hwrap .js-fix .search .box .i_link {
		cursor: pointer;
		position: absolute;
			z-index: 10;
			top: 0;
			right: 0;
		width: 5em;
		height: 100%;
		background: url("../images/h_search.png") no-repeat center;
		background-size: 1.5em;
	}
.hwrap .js-fix .shopmenu {
	margin-left: 1em;
}
	.hwrap .js-fix .shopmenu a {
		display: inline-block;
		width: 4em;
		height: 4em;
		background: no-repeat center;
		background-size: auto 2.6em;
	}
	.hwrap .js-fix .shopmenu a.CART {background-image: url("../images/h_cart.png");}
	.hwrap .js-fix .shopmenu a.MY {background-image: url("../images/h_my.png");}

.hwrap .js-fix .menu1 .item_in {
  display: none;
  background: #f7ead9;
  width: 100%;
  position: absolute;
  top: 6.6em;
  left: 0;
  right: 0;
  z-index: 9999;
}
.hwrap .js-fix .menu1 .item_in.is-open {
  display: block;
}
.hwrap .js-fix .menu2 {
	display: flex;
  justify-content: space-between;
	max-width: 1100px;
  margin: 0 auto;
}
.hwrap .js-fix .menu2 .link {
	padding: 1em 0 1.5em 0;
	font-size: 1.2em;
	text-decoration: none;
	letter-spacing: 0.1em;
}
.hwrap .js-fix .menu2 .togglearea {
	position: relative;
}
	.hwrap .js-fix .menu2 .togglearea .link {
		display: flex;
			align-items: center;
	}
		.hwrap .js-fix .menu2 .togglearea .link:after {
			content: "";
			display: block;
			width: 0.8em;
			height: 0.4em;
			margin-left: 0.4em;
			background: url("../images/h_m2_arr.png") no-repeat center;
			background-size: contain;
		}
	.hwrap .js-fix .menu2 .togglearea .box {
		pointer-events: none;
		position: absolute;
			z-index: 10;
			left: 0;
		display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
		width: 15em;
		height: 11em;
		padding: 0 0 0 3em;
		background: #f5debf;
		opacity: 0;
	}
		.hwrap .js-fix .menu2 .togglearea:hover .box {
			pointer-events: auto;
			opacity: 1;
		}
		.hwrap .js-fix .menu2 .togglearea .box .link {
			padding: 1em 0;
		}
			.hwrap .js-fix .menu2 .togglearea .box .link:after {
				content: "";
				display: block;
				width: 0.8em;
				height: 0.4em;
				margin-left: 0.4em;
				background: url("../images/h_m2_arr.png") no-repeat center;
				background-size: contain;
				transform: rotate(-90deg);
			}



.fv {}
.fv .slider {}
.fv .slider .link {
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.fv .slider .link img {
	width: 200em;
	max-width: none;
}
.fv .slider .slick-dots {
	position: relative;
	z-index: 1000;
	display: flex;
	justify-content: center;
	margin-top: calc(-5em - 1.7em);
	padding-bottom: 5em;
}
.fv .slider .slick-dots li {
		text-indent: 150%;
		white-space: nowrap;
		overflow: hidden;
	width: 1.7em;
	height: 1.7em;
	margin: 0 1.7em;
	border: 0.1em solid #fff;
	border-radius: 50%;
}
	.fv .slider .slick-dots li.slick-active {
		background: #937249;
	}




.news {
	padding: 8.7em 0 4.7em;
}
.news .content {
	position: relative;
	display: flex;
		align-items: center;
	min-height: 12em;
	padding: 0 8em 0 5em;
	border: 0.1em solid #c3c3c3;
	border-radius: 1em;
}
.news .head {
}
.news .head h2 {
}
	.news .head h2:after {
		content: "お知らせ";
		display: block;
		margin-top: 1.2em;
		font-size: 1.4em;
		text-align: center;
		line-height: 1;
		letter-spacing: 0.05em;
	}
.news .head h2 img {
	width: 12.7em;
}
.news .lists {
	padding-left: 3.5em;
}
.news .lists li {
	display: flex;
}
.news .lists time {
	margin-right: 1em;
	color: #c79e70;
	font-size: 1.4em;
	font-weight: 700;
	letter-spacing: 0.05em;
}
.news .lists .link {
	font-size: 1.4em;
	font-weight: 300;
	text-decoration: none;
	letter-spacing: 0.05em;
}
	.news .lists .link:hover {
		text-decoration: underline;
	}
.news .btn {
	position: absolute;
		z-index: 10;
		top: 50%;
		right: 4em;
		transform: translateY(-50%);
}
	.news .btn img {
		width: 3em;
	}



.ranking {
	padding: 10em 0;
	background: #fefaef;
}
.ranking h2 {
	font-size: 1.4em;
	line-height: 2.5;
	text-align: center;
	letter-spacing: 0.05em;
}
	.ranking h2:before {
		content: "";
		display: block;
		height: 3.2em;
		background: url("../images/rank_head.png") no-repeat center;
		background-size: 17em;
	}
.ranking .content {
	position: relative;
	display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-rows: min-content min-content;
		gap: 0px 0px;
		grid-template-areas:
			"rank1 rank1 rank2 rank3"
			"rank1 rank1 rank4 rank5";
		justify-content: space-between;
		justify-items: end;
		align-items: stretch;
	width: 102em;
	margin: 0 auto;
	margin-top: 1em;
}
	.ranking .rank1 { grid-area: rank1; width: 56em; }
	.ranking .rank2 { grid-area: rank2; }
	.ranking .rank3 { grid-area: rank3; }
	.ranking .rank4 { grid-area: rank4; }
	.ranking .rank5 { grid-area: rank5; }
	.ranking .rank2,
	.ranking .rank3,
	.ranking .rank4,
	.ranking .rank5 { width: 20em; }
		.ranking .link:before {
			content: "";
			display: block;
			height: 6.6em;
			margin-bottom: 1.3em;
			background: no-repeat center bottom;
			background-size: 10.7em;
		}
		.ranking .rank1:before { background-image: url("../images/rank_1_icon.png"); }
		.ranking .rank2:before { background-image: url("../images/rank_2_icon.png"); }
		.ranking .rank3:before { background-image: url("../images/rank_3_icon.png"); }
		.ranking .rank4:before { background-image: url("../images/rank_4_icon.png"); }
		.ranking .rank5:before { background-image: url("../images/rank_5_icon.png"); }

.ranking .link {
	display: flex;
		flex-direction: column;
	text-align: center;
	text-decoration: none;
}
.ranking .link .txt {
	display: flex;
		flex: 1;
		flex-direction: column;
	margin-top: 1em;
}
.ranking .link .txt .n {
	display: block;
	font-size: 1.6em;
	font-weight: 700;
	line-height: 1.625;
	letter-spacing: 0.05em;
}
.ranking .link .txt .p {
	display: block;
	margin-top: auto;
	font-size: 1.4em;
	letter-spacing: 0.05em;
}
	.ranking .link.rank1 .txt .p {
		margin-top: 0;
	}
	.ranking .link .txt .p:before {
		content: "\0a5";
		font-size: inherit;
	}
	.ranking .link .txt .p:after {
		content: "(税込)";
		font-size: inherit;
	}



.newsarr,
.recommend {
	margin: 10em 0;
	background: #fff;
}
.newsarr h2,
.recommend h2 {
	font-size: 1.4em;
	line-height: 2.5;
	text-align: center;
	letter-spacing: 0.05em;
}
	.newsarr h2:before,
	.recommend h2:before {
		content: "";
		display: block;
		height: 3.2em;
		background: no-repeat center;
		background-size: 24.7em;
	}
	.newsarr h2:before { background-image: url("../images/newsarr_head.png"); }
	.recommend h2:before { background-image: url("../images/recommend_head.png");background-size: 23.4em; }
.newsarr .content,
.recommend .content {
	position: relative;
	display: flex;
	justify-content: space-between;
	margin: 3em auto;
	margin-top: 4em;
	flex-wrap: wrap;
}
.newsarr .link,
.recommend .link {
	display: flex;
	flex-direction: column;
	width: 26em;
	text-align: center;
	text-decoration: none;
	margin-bottom: 4em;
}
.newsarr .link .txt,
.recommend .link .txt {
	display: flex;
		flex: 1;
		flex-direction: column;
	margin-top: 1em;
}
.newsarr .link .txt .n,
.recommend .link .txt .n {
	display: block;
	font-size: 1.6em;
	font-weight: 700;
	line-height: 1.625;
	letter-spacing: 0.05em;
}
.newsarr .link .txt .p,
.recommend .link .txt .p {
	display: block;
	margin-top: auto;
	font-size: 1.4em;
	letter-spacing: 0.05em;
}
	.newsarr .link.rank1 .txt .p,
	.recommend .link.rank1 .txt .p {
		margin-top: 0;
	}
	.newsarr .link .txt .p:before,
	.recommend .link .txt .p:before {
		content: "\0a5";
		font-size: inherit;
	}
	.newsarr .link .txt .p:after,
	.recommend .link .txt .p:after {
		content: "(税込)";
		font-size: inherit;
	}
			.newsarr .link {
				position: relative;
			}
			.newsarr .link:after {
				content: "";
				position: absolute;
					z-index: 10;
					top: -1.5em;
					left: 1.5em;
				display: block;
				width: 7em;
				height: 7em;
				background: url("../images/newsarr_icon.png");
				background-size: contain;
			}



.about {
	width: 100%;
	padding: 10em 0 12.3em 0;
	background: url("../images/about_bg.jpg") no-repeat center;
	background-size: 200em;
}
.about .content {
	display: flex;
		justify-content: space-around;
	padding: 7em 4em;
	border-radius: 1.5em;
	background: rgba(255,255,255,0.75);
}
.about .logo {
	width: 28.8em;
	margin-top: 9em;
}
.about .box h2 {
	margin-bottom: 3em;
}
.about .box p {
	font-size: 1.6em;
	line-height: 2.85;
	letter-spacing: 0.05em;
}
.about .box .link {
	display: flex;
		justify-content: center;
		align-items: center;
	width: 20em;
	height: 5em;
	border: 0.1em solid #333;
	margin-top: 5em;
}
	.about .box .link img {
		width: 5.2em;
	}



.media {
	padding: 10em 0;
}
.media .content {
	display: flex;
		justify-content: center;
}
.media .img {
	flex-shrink: 0;
	margin-right: -9.6em;
}
.media .txt {
	display: flex;
		flex-shrink: 0;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	width: 45.5em;
	height: 53.1em;
	margin-top: 3em;
	background: url("../images/media_bg.png") no-repeat center;
	background-size: contain;
}
.media .txt h2 {
	width: 11.7em;
	padding-top: 9em;
}
.media .txt p {
	margin-top: 2.5em;
	font-size: 1.4em;
	font-weight: 700;
	text-align: center;
	line-height: 2.14;
	letter-spacing: 0.05em;
}
.media .txt .link {
	display: flex;
		justify-content: center;
		align-items: center;
	width: 20em;
	height: 5em;
	border: 0.1em solid #333;
	margin-top: 5em;
}
	.media .txt .link img {
		width: 5.2em;
	}



.shop {
	padding: 10em 0 8.6em 0;
	background: #fefaef;
}
.shop h2 {
	font-size: 1.4em;
	line-height: 2.5;
	text-align: center;
	letter-spacing: 0.05em;
}
	.shop h2:before {
		content: "";
		display: block;
		height: 3.2em;
		background: url("../images/shop_head.png") no-repeat center;
		background-size: 18.2em;
	}
.shop .content {
	position: relative;
	display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	margin: 0 auto;
	margin-top: 4em;
}
.shop a.link {
	display: flex;
		align-items: center;
	width: 53em;
	margin-bottom: 4em;
	text-decoration: none;
	background: #fff;
}
.shop .link .txt {
	padding: 0 2em;
}
	.shop .link .txt .n {
		font-size: 1.6em;
		font-weight: 700;
		line-height: 1.31;
		letter-spacing: 0.05em;
	}
.shop a.btn {
	display: flex;
		justify-content: center;
		align-items: center;
	width: 23em;
	height: 4em;
	margin: 0 auto;
	margin-top: 2em;
	border: 0.1em solid #333;
}
	.shop .btn img {
		width: 5.2em;
	}



footer {
	padding: 10em 0 0 0;
	background: #f7ead9;
}
footer .content {
	position: relative;
	padding: 5.8em 0 7em 0;
	background: #fefaef;
}

footer .content .merumaga {
	margin-bottom: 3em;
}
footer .content .merumaga a {
  display: block;
  font-size: 1.6em;
  font-weight: bold;
  line-height: 3.6em;
  text-align: center;
  letter-spacing: 0.15em;
  width: 25em;
  margin: 0 auto;
  border: solid 1px #333;
}
footer .content .merumaga a:hover {
  color: #fff;
  background: #333;
  opacity: 1;
}

footer .content .bnr_area {
  width: 72em;
  margin: 0 auto;
}
footer .content .bnr_area a {
  display: block!important;
  width: 72em;
	margin-bottom: 4em;
}

footer .content .foot_bot {
  display: flex;
  justify-content: center;
  align-content: center;
}

footer .content .badge {
	position: absolute;
		z-index: 10;
		top: -10em;
		left: 5em;
	width: 14em;
}


footer .calendar {
	margin-right: 5em;
}
footer .calendar h2 {
	font-size: 1.6em;
	letter-spacing: 0.05em;
}
	footer .calendar h2 span {
		font-size: inherit;
	}
footer .calendar iframe {
	width: 100%;
	height: 100%;
	width: 32.8em;
	height: 29.5em;
	margin-top: 1.5em;
	border: 0;
	overflow: hidden;
}
footer .footnav {
	margin-left: 5em;
}
footer .footnav .linkarea {
	display: flex;
	margin-top: 3em;
}
footer .footnav .linkarea .lists {
	margin-right: 5em;
	padding: 0;
}
footer .footnav .linkarea .link {
	font-size: 1.4em;
	font-weight: 300;
	line-height: 2.85;
	letter-spacing: 0.05em;
	text-decoration: none;
}
footer .footnav .snsarea {
	margin-top: 3em;
}
footer .footnav .snsarea .i_link {
	width: 4em;
	height: 4em;
	margin-right: 3em;
	background: url("../images/f_snsicon.png") no-repeat center;
	background-size: auto 4em;
}
	footer .footnav .snsarea .sns_f { background-position: left; }
	footer .footnav .snsarea .sns_t {}
	footer .footnav .snsarea .sns_i { background-position: right; }
footer small {
	display: block;
	padding: 4.2em 0;
	font-size: 1.4em;
	font-weight: 300;
	text-align: center;
	line-height: 1;
	letter-spacing: 0.05em;
}