@charset "utf-8";
.txtEx {
	text-indent: 120%;
	white-space: nowrap;
	overflow: hidden;
}
.PC {display: none;}
.SP {display: inherit;}

html {
}
.toparea,
.toparea *,
.toparea *::before,
.toparea *::after {
	font-size: 1.302vw; /*defaultFontsize(10px) / maxWidth(750px) * 100*/
}

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

/*--No2*/

/*No3*/


body {
  margin-top: 15.7vw;
}

.content {
	max-width: none;
}

header {}
.hwrap {
	display: flex;
		flex-direction: column;
}
.hwrap .status {
		order: 2;
	padding: 1.5em;
	/*margin-top: 12em;*/
	text-align: center;
}
	.hwrap .status span {
		font-size: 2.4em;
		letter-spacing: 0.1em;
	}
	.hwrap .status .userrank {
		margin-left: 1em;
	}
.hwrap .js-fix {
	/*position: fixed;
		z-index: 10000;
		order: 1;
		right: 0;
		left: 0;
	height: 12em;*/
}
	.hwrap .js-fix .content {
		position: fixed;
			z-index: 10000;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
		display: grid;
			grid-template-columns: 1fr 1fr 1fr;
			grid-template-rows: min-content min-content min-content min-content min-content;
			gap: 0px 0px;
			grid-template-areas:
				". logo shopmenu"
				"search search search"
				"menu2 menu2 menu2"
				"menu1 menu1 menu1"
				"sns sns sns";
			justify-content: space-between;
			justify-items: center;
			align-items: stretch;
		padding-bottom: 5em;
		background: #f7ead9;
		overflow: scroll;
	}
	.js-fix .sns { grid-area: sns; }
.hwrap .js-fix .sns {
	display: flex;
	margin-top: 2em;
}
.hwrap .js-fix .sns .i_link {
	width: 8em;
	height: 8em;
	margin-right: 6em;
	background: url("../images/f_snsicon.png") no-repeat center;
	background-size: auto 8em;
}
	.hwrap .js-fix .sns .sns_f { background-position: left; }
	.hwrap .js-fix .sns .sns_t {}
	.hwrap .js-fix .sns .sns_i { background-position: right;margin-right: 0; }
.hwrap .js-fix .logo a {
	background-image: url("../images/h_logo_sp.png");
	width: 32em;
	height: 12em;
}
.hwrap .js-fix .menu1 {
  display: block;
	width: 66.8em;
	margin: 0 auto;
	margin-top: 6em;
}
.hwrap .js-fix .menu1 .menu1_list {
  display: block;
}
.hwrap .js-fix .menu1 .menu1_list .i_link:hover,
.hwrap .js-fix .menu1 .menu1_list .i_link.is-open {
  border-bottom: none;
}
.hwrap .js-fix .menu1 .menu1_list .i_link {
	width: 66.8em;
	height: 9em;
  background-size: 100%;
}
.hwrap .js-fix .menu1 .menu1_list > li {
  margin-bottom: 2em;
}
.hwrap .js-fix .menu1 .item_in {
  position: static;
  margin-bottom: 7.5em;
}
.hwrap .js-fix .menu1 .i_link.ITEM {background-image: url("../images/h_m1_item_sp.png");}
.hwrap .js-fix .menu1 .i_link.BRAND {background-image: url("../images/h_m1_brand_sp.png");}
.hwrap .js-fix .menu1 .i_link.GUIDE {background-image: url("../images/h_m1_guide_sp.png");}
.hwrap .js-fix .menu1 .i_link.CONTACT {background-image: url("../images/h_m1_contact_sp.png");}
.hwrap .js-fix .menu1 .i_link.MEMBER {background-image: url("../images/h_m1_member_sp.png");}
.hwrap .js-fix .menu1 .i_link.SHOPLIST {background-image: url("../images/h_m1_shoplist_sp.png");}

.hwrap .js-fix .menu1 .i_link.ITEM {
  order: 1;
  position: relative;
}
.hwrap .js-fix .menu1 .i_link.ITEM::before {
  content: "";
  display: block;
  width: 2.5em;
  height: 1.5em;
  margin-top: -0.5em;
  background: url("../images/h_m2_arr.png") no-repeat center;
  background-size: contain;
  position: absolute;
  z-index: 10;
  top: 50%;
  right: 2.5em;
}
.hwrap .js-fix .menu1 .i_link.is-open.ITEM::before {
  transform: scaleY(-1);
}
.hwrap .js-fix .menu1 .i_link.BRAND { order: 3;}
.hwrap .js-fix .menu1 .i_link.GUIDE { order: 2;}
.hwrap .js-fix .menu1 .i_link.CONTACT { order: 4;}
.hwrap .js-fix .search {
	margin: 0 auto;
	margin-top: 6em;
}
.hwrap .js-fix .search .box {
	width: 66.8em;
	height: 9em;
	padding: 0 10em 0 3em;
}
	.hwrap .js-fix .search .box input {
		font-size: 3.6em;
	}
	.hwrap .js-fix .search .box .i_link {
		width: 10em;
		background-size: 3.6em;
	}
.hwrap .js-fix .shopmenu {
	display: flex;
		align-items: center;
	margin-left: 1em;
}
	.hwrap .js-fix .shopmenu a {
		width: 8.4em;
		height: 8.4em;
		background-size: auto 7.6em;
	}
.hwrap .js-fix .menu2 {
	display: block;
	width: 66.8em;
	text-align: left;
}
.hwrap .js-fix .menu2 .link {
	width: 100%;
	padding: 1em 0 1em 0.6em;
	font-size: 2.6em;
	font-weight: 300;
	letter-spacing: 0.05em;
	border-bottom: 0.1em solid #333;
}
.hwrap .js-fix .menu2 .togglearea {
}
	.hwrap .js-fix .menu2 .togglearea .link {
		position: relative;
	}
		.hwrap .js-fix .menu2 .togglearea > .link {
			pointer-events: none;
		}
		.hwrap .js-fix .menu2 .togglearea .link:after {
			position: absolute;
				z-index: 10;
				right: 2.5em;
			width: 2em;
			height: 1em;
		}
	.hwrap .js-fix .menu2 .togglearea .box {
		pointer-events: none;
		position: static;
		display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
		width: 100%;
		height: 0;
		padding: 0;
		background: none;
		opacity: 0;
	}
				.hwrap .js-fix .menu2 .togglearea.is-open .box {
					padding-top: 4em;
				}
		.hwrap .js-fix .menu2 .togglearea:hover .box {
			pointer-events: none;
			height: 0;
			opacity: 0;
		}
		.hwrap .js-fix .menu2 .togglearea .box .link {
			padding: 1em 0 1em 0.6em;
		}
						.hwrap .js-fix .menu2 .togglearea .box .link:not(:last-child) {
							border: 0;
						}
						.hwrap .js-fix .menu2 .togglearea .box .link:last-child {
							padding-bottom: 2em;
						}
			.hwrap .js-fix .menu2 .togglearea .box .link:before {
				content: "ー";
			}
			.hwrap .js-fix .menu2 .togglearea .box .link:after {
				position: absolute;
					z-index: 10;
					right: 2.5em;
				width: 2em;
				height: 1em;
				transform: rotate(-90deg);
			}
				.hwrap .js-fix .menu2 .togglearea.is-open {
				}
					.hwrap .js-fix .menu2 .togglearea.is-open > .link:after {
						transform: scaleY(-1);
					}
				.hwrap .js-fix .menu2 .togglearea.is-open .box {
					pointer-events: auto;
					height: auto;
					opacity: 1;
				}
	.hwrap .js-fix .burger_btn {
		position: absolute;
			z-index: 20000;
			left: 3em;
			top: 1.8em;
		width: 8.4em;
		height: 8.4em;
		background: url("../images/h_btn_menu.png") no-repeat center;
		background-size: contain;
	}
						.hwrap .js-fix .burger_btn.is-active {
							background-image: url("../images/h_btn_close.png");
						}
		.hwrap .js-fix .content {
			height: 12em;
			overflow: hidden;
		}
			.hwrap .js-fix .content.is-active {
				height: auto;
				overflow: scroll;
			}




.fv .slider .link img {
	width: 100%;
}
.fv .slider .slick-dots {
	padding: 0;
	padding-bottom: 5em;
}
.fv .slider .slick-dots li {
	width: 1.9em;
	height: 1.9em;
	margin: 0 1.9em;
}
	.fv .slider .slick-dots li.slick-active {
	}



.movie {
	padding: 9em 0 4em 0;
}
.movie h2 {
	font-size: 2.6em;
	line-height: 2.5;
}
	.movie h2:before {
		height: 4.2em;
		background-size: 35em;
	}
#youtube_wrap {
  max-width: 100%;
}
.news {
	padding: 7.5em 0 3.5em;
}
.news .content {
	position: relative;
	display: flex;
		align-items: center;
	width: 66.8em;
	min-height: 26em;
	padding: 0 8em 0 5em;
	border: 0.1em solid #c3c3c3;
	border-radius: 1em;
}
.news .head {
		flex-shrink: 0;
}
.news .head h2 {
}
	.news .head h2:after {
		margin-top: 1.5em;
		font-size: 2em;
	}
.news .head h2 img {
	width: 12.7em;
}
.news .lists {
	padding-left: 5em;
}
.news .lists li {
	display: block;
}
.news .lists time {
	font-size: 2.4em;
	line-height: 2;
}
.news .lists .link {
	font-size: 2.4em;
}
	.news .lists .link:hover {
	}
.news .btn {
		right: 2.8em;
}
	.news .btn img {
		width: 4em;
	}



.ranking {
	padding: 7.5em 0 10em 0;
}
.ranking h2 {
	font-size: 2.6em;
	line-height: 2.5;
}
	.ranking h2:before {
		content: "";
		display: block;
		height: 4.6em;
		background: url("../images/rank_head.png") no-repeat center;
		background-size: 32.2em;
	}
.ranking .content {
	display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: min-content min-content min-content;
		gap: 0px 0px;
		grid-template-areas:
			"rank1 rank1"
			"rank2 rank3"
			"rank4 rank5";
		justify-content: space-between;
		justify-items: center;
		align-items: stretch;
	width: 100%;
	margin-top: 4em;
}
	.ranking .rank1 { grid-area: rank1; }
	.ranking .rank2 { grid-area: rank2; }
	.ranking .rank3 { grid-area: rank3; }
	.ranking .rank4 { grid-area: rank4; }
	.ranking .rank5 { grid-area: rank5; }
	.ranking .rank2,
	.ranking .rank4 { justify-self: end;width: 26em; }
	.ranking .rank3,
	.ranking .rank5 { justify-self: start;width: 26em; }
		.ranking .link:before {
			height: 9.4em;
			margin-bottom: 2em;
			background-size: 16.4em;
		}
		.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 {
	margin: 0 2em;
}
.ranking .link .txt {
	margin-top: 1.5em;
}
.ranking .link .txt .n {
	font-size: 2.8em;
	line-height: 1.3;
}
.ranking .link .txt .p {
	font-size: 2.4em;
	line-height: 1.7;
}
	.ranking .link.rank1 .txt .p {
	}
	.ranking .link .txt .p:after {
	}



.newsarr,
.recommend {
	margin: 10em 0 5em 0;
}
.newsarr h2,
.recommend h2 {
	font-size: 2.6em;
	line-height: 2.5;
}
	.newsarr h2:before,
	.recommend h2:before {
		height: 4.6em;
		background-size: 45.8em;
	}
	.newsarr h2:before { background-image: url("../images/newsarr_head.png"); }
	.recommend h2:before { background-image: url("../images/recommend_head.png");background-size: 45.2em; }
.newsarr .content,
.recommend .content {
		flex-wrap: wrap;
		justify-content: center;
	margin-top: 6.5em;
}
.newsarr .link,
.recommend .link {
	width: 32em;
	margin: 0 1.4em;
	margin-bottom: 4em;
}
.newsarr .link .txt,
.recommend .link .txt {
	margin-top: 2em;
}
.newsarr .link .txt .n,
.recommend .link .txt .n {
	font-size: 2.6em;
	line-height: 1.3;
}
.newsarr .link .txt .p,
.recommend .link .txt .p {
	font-size: 2.4em;
	line-height: 2.5;
}
	.newsarr .link.rank1 .txt .p,
	.recommend .link.rank1 .txt .p {
		margin-top: 0;
	}
	.newsarr .link .txt .p:after,
	.recommend .link .txt .p:after {
		content: "(税込)";
	}
			.newsarr .link {
				position: relative;
			}
			.newsarr .link:after {
					top: -2em;
					left: 1em;
				width: 8.8em;
				height: 8.8em;
			}



.about {
	padding: 7em 0;
	background: url("../images/spabout_bg.jpg") no-repeat center;
	background-size: 100% 100%;
}
.about .content {
	display: block;
	width: 66.8em;
	padding: 2.5em 6em 8.5em 6em;
}
.about .logo {
	width: 20em;
	margin: 0 auto;
	margin-bottom: 2.5em;
}
.about .box h2 {
	width: 35.9em;
	margin: 0 auto;
	margin-bottom: 2em;
}
.about .box p {
	font-size: 2.6em;
	line-height: 2.18;
}
.about .box .link {
	width: 44em;
	height: 10em;
	margin: 0 auto;
	border: 0.2em solid #333;
	margin-top: 10em;
}
	.about .box .link img {
		width: 8.6em;
	}



.media {
}
.media .content {
	position: relative;
		flex-direction: column;
}
	.media .content:after {
		content: "";
		display: block;
			order: 3;
		height: 18.5em;
		margin-top: 16em;
		background: url("../images/spmedia_bgb.png") no-repeat top;
		background-size: contain;
	}
.media .img {
		order: 2;
	width: 64.9em;
	margin: 0 auto;
	margin-top: 4.5em;
}
.media .txt {
		order: 1;
	width: 100%;
	height: auto;
	margin-top: 0;
	background: url("../images/spmedia_bga.png") no-repeat top;
	background-size: contain;
}
.media .txt h2 {
	width: 22em;
	margin-bottom: 3em;
	padding-top: 25.4em;
}
.media .txt p {
	margin-top: 0;
	font-size: 2.6em;
	line-height: 1.69;
}
.media .txt .link {
	position: absolute;
		bottom: 18.5em;
		left: calc(50% - 44em / 2);
	width: 44em;
	height: 10em;
	border: 0.2em solid #333;
	margin-top: 0;
}
	.media .txt .link img {
		width: 8.6em;
	}



.shop {
	padding: 9em 0 11em 0;
}
.shop h2 {
	font-size: 2.6em;
	line-height: 2.5;
}
	.shop h2:before {
		height: 4.2em;
		background-size: 35em;
	}
.shop .content {
	display: block;
	margin-top: 4em;
}
.shop a.link {
	width: 66.8em;
	margin: 0 auto;
	margin-bottom: 3em;
}
.shop .link img {
	width: 20em;
}
.shop .link .txt {
	padding: 0 3.6em;
}
	.shop .link .txt .n {
		font-size: 2.6em;
		line-height: 1.56;
	}
.shop a.btn {
	width: 44em;
	height: 10em;
	margin-top: 4em;
	border: 0.2em solid #333;
}
	.shop .btn img {
		width: 8.6em;
	}



footer {
	padding: 6em 0 0 0;
}
footer .content {
	display: block;
	width: 66.8em;
	margin: 0 auto;
	padding: 12em 0 7em 0;
}
	footer .content .badge {
			top: -8.5em;
			left: 4.3em;
	}

footer .content .merumaga {
	margin-bottom: 6em;
}
footer .content .merumaga a {
  display: block;
  font-size: 2.6em;
  font-weight: bold;
  line-height: 3.6em;
  text-align: center;
  letter-spacing: 0.15em;
  width: 22.5em;
  margin: 0 auto;
  border: solid 2px #333;
}

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

footer .content .foot_bot {
  display: block;
}

footer .calendar {
	width: 50em;
	margin: 0 auto;
}
footer .calendar h2 {
	font-size: 2.6em;
	text-align: center;
}
	footer .calendar h2 span {
	}
footer .calendar iframe {
	width: 100%;
	height: 46em;
	margin-top: 2.6em;
}
footer .footnav {
	width: 55em;
	margin: 0 auto;
}
footer .footnav .linkarea {
	display: flex;
	margin-top: 3em;
}
footer .footnav .linkarea .lists {
	margin-right: 5em;
	padding: 0;
}
footer .footnav .linkarea .link {
	font-size: 2.6em;
	line-height: 2.92;
	white-space: nowrap;
}
footer .footnav .snsarea {
	display: flex;
		justify-content: center;
	margin-top: 3em;
}
footer .footnav .snsarea .i_link {
	width: 8em;
	height: 8em;
	margin: 0 3em;
	background: url("../images/f_snsicon.png") no-repeat center;
	background-size: auto 8em;
}
	footer .footnav .snsarea .sns_f { background-position: left; }
	footer .footnav .snsarea .sns_t {}
	footer .footnav .snsarea .sns_i { background-position: right; }
footer small {
	padding: 1.85em 0;
	font-size: 2em;
}