@charset "UTF-8";

/*-----------------------------------

	mainvisual

-----------------------------------*/
#mainvisual {
	padding: 0 1vw 2.93vw;
	position: relative;
}
#mainvisual a.about {
	display: block;
	width: fit-content;
	font-size: 1.46vw;
	line-height: 2.93vw;
	padding-right: 4.03vw;
	background: url(../img/index/mv_arrow.svg) no-repeat right center/2.93vw;
	position: absolute;
	top: 25.84vw;
	left: 50%;
	transform: translateX(-50%);
}
@media screen and (max-width: 840px) {
	#mainvisual img {
		width: 100%;
		height: 60vw;
		object-fit: cover;
	}
	#mainvisual a.about {
		font-size: 2.38vw;
		line-height: 4.76vw;
		padding-right: 6.55vw;
		background: url(../img/index/mv_arrow.svg) no-repeat right center/4.76vw;
		top: 36.5vw;
	}
}
@media screen and (max-width: 640px) {
	#mainvisual {
		padding: 0 1vw 5.33vw;
	}
	#mainvisual img {
		height: 74.67vw;
	}
	#mainvisual a.about {
		font-size: 2.67vw;
		line-height: 5.33vw;
		padding-right: 8vw;
		background: url(../img/index/mv_arrow.svg) no-repeat right center/5.33vw;
		top: 45.5vw;
	}
}
/*-----------------------------------

	point_block

-----------------------------------*/
#point_block {
	background: #FEE30B;
}
#point_block .contents_inner {
	position: relative;
	padding: 55px 0 75px;
}
#point_block .deco {
	width: 168px;
	position: absolute;
	top: -48px;
	left: 0;
}
#point_block h2 {
	text-align: center;
	font-size: 40px;
	font-weight: 900;
	margin-bottom: 60px;
}
#point_block ul {
	display: flex;
	flex-wrap: wrap;
	gap: 15px 1.5625%;
}
#point_block ul li {
	width: 18.75%;
}
#point_block ul li a {
	background: #FFF;
	border-radius: 10px;
	text-align: center;
	height: 140px;
	display: grid;
	place-content: center;
	place-items: center;
	row-gap: 15px;
	position: relative;
}
#point_block ul li a::before {
	content: "";
	width: 36px;
	height: 36px;
	background: #FEE30B url(../img/index/point_arrow.svg) no-repeat calc(100% - 7px) calc(100% - 2px)/10px;
	clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	position: absolute;
	bottom: -1px;
	right: -1px;
}
#point_block ul li a .shopname {
	font-size: 15px;
	line-height: 1.33;
}
#point_block ul li a .magnification {
	font-size: 25px;
	font-weight: 900;
	color: #DB002A;
	display: flex;
	justify-content: center;
	align-items: baseline;
	gap: 0 10px;
}
#point_block ul li a .magnification span {
	font-size: 60px;
	font-family: "Open Sans", sans-serif;
	text-box: trim-both cap alphabetic;
	color: #000000;
}
#point_block ul li a .magnification span.red {
	color: #DB002A;
}
@media screen and (max-width: 840px) {
	#point_block .deco {
		width: 130px;
	}
	#point_block ul {
		gap: 15px 2%;
	}
	#point_block ul li {
		width: 32%;
	}
}
@media screen and (max-width: 640px) {
	#point_block .contents_inner {
		padding: 30px 0;
	}
	#point_block .deco {
		width: 73px;
		top: -20px;
	}
	#point_block h2 {
		font-size: 20px;
		margin-bottom: 20px;
	}
	#point_block ul {
		width: min(420px,100%);
		margin: 0 auto;
		gap: 10px 4%;
	}
	#point_block ul li {
		width: 48%;
	}
	#point_block ul li a {
		height: 100px;
		row-gap: 10px;
	}
	#point_block ul li a::before {
		width: 33px;
		height: 33px;
		background: #FEE30B url(../img/index/point_arrow.svg) no-repeat calc(100% - 6px) calc(100% - 6px)/8px;
	}
	#point_block ul li a .shopname {
		font-size: 12px;
	}
	#point_block ul li a .magnification {
		font-size: 18px;
		gap: 0 5px;
	}
	#point_block ul li a .magnification span {
		font-size: 40px;
	}

}