@charset "utf-8";
/*---------------------------------------------
Reset
---------------------------------------------*/

html {
	color: #333;
	overflow-y: scroll;
	font-family: Noto Sans JP, ヒラギノ角ゴ ProN W3, Meiryo, sans-serif;
	font-size: 62.5%;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: normal;
	margin: 0;
	padding: 0;
}

img {
	border: none;
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

div,
dl,
dt,
dd,
form,
input,
ul,
ol,
li,
p,
select,
textarea,
span,
th,
td {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
}

ul {
	list-style: none;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

/*---------------------------------------------
Style
---------------------------------------------*/
body {
	margin: 0 auto;
	padding: 0;
	font-size: 1.6rem;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: bold;
}

.for_pc {
	display: block;
	margin: 0 auto;
}

.for_ipad {
	display: none;
	margin: 0 auto;
}

.for_sp {
	display: none;
	margin: 0 auto;
}

.inner {
	max-width: 1200px;
	width: 100%;
	margin-inline: auto;
}

@media screen and (min-width:751px) and (max-width:1280px) {
	.for_ipad {
		display: block;
		margin: 0 auto;
	}

	.inner {
		width: 90%;
	}
}

/* sp */
@media screen and (max-width: 767px) {

	body {
		font-size: 1.4rem;
	}

	.for_pc {
		display: none;
		margin: 0 auto;
	}

	.for_ipad {
		display: none;
		margin: 0 auto;
	}

	.for_sp {
		display: block;
		margin: 0 auto;
	}

	.inner {
		max-width: 100%;
		padding: 2rem;
	}
}

/* =========================================================
リボン
========================================================= */

.day_wrap {
	margin-block: 2rem;
}

.day_wrap .day {
	display: inline-block;
	position: relative;
	height: 80px;
	padding: 0 8rem;
	background: #fff2e4;
	color: #333;
	font-size: 4rem;
	font-weight: 700;
	line-height: 80px;
}

.day_wrap .day::before,
.day_wrap .day::after {
	position: absolute;
	content: '';
	width: 0px;
	height: 0px;
	z-index: 1;
}

.day_wrap .day::before {
	top: 0;
	left: 0;
	border-width: 40px 0px 40px 24px;
	border-color: transparent transparent transparent #e48188;
	border-style: solid;
}

.day_wrap .day::after {
	top: 0;
	right: 0;
	border-width: 40px 24px 40px 0px;
	border-color: transparent #e48188 transparent transparent;
	border-style: solid;
}

.day_wrap .day .big {
	font-size: 1.3em;
}

.day_wrap .day .sat {
	color: #6fafc3;
}

.black .day_wrap .day {
	background: #fff;
}

@media screen and (max-width: 1040px) {

	.day_wrap .day {
		font-size: 2.8rem;
		padding: 0 4rem;
	}

	div .day_wrap .day.long {
		letter-spacing: -0.04em;
	}
}

@media screen and (max-width: 767px) {
	.day_wrap .day {
		height: 50px;
		padding: 0 2rem;
		font-size: 1.6rem;
		line-height: 50px;
	}

	.day_wrap .day.long {
		letter-spacing: -0.07em;
	}

	.day_wrap .day::before {
		border-width: 25px 0px 25px 12px;
	}

	.day_wrap .day::after {
		border-width: 25px 12px 25px 0px;
	}

}


/* =========================================================
ヘッダー
========================================================= */

header {
	background: #e48188;
	padding-block: 4rem 8rem;
}

header .inner {
	position: relative;
	text-align: center;
}

header .inner .logo {
	position: absolute;
	top: 0;
	left: 2rem;
	background: #fff;
	padding: 1rem 3rem;
}

header .inner .logo img {
	max-width: 200px;
}

header .inner .mv {
	padding: 7rem 2rem 4rem;
}

header .inner .mv p {
	font-size: 4rem;
	color: #fff;
}

@media screen and (max-width: 767px) {
	header {
		padding-block: 2rem 4rem;
	}

	header .inner {
		padding: 0;
	}


	header .inner .logo {
		left: 1rem;
		padding: 0.6rem 2rem;
	}

	header .inner .logo img {
		max-width: 120px;
	}

	header .inner .mv {
		padding: 4rem 1rem 2rem;
	}

	header .inner .mv p {
		font-size: 2rem;
		line-height: 1.3;
		margin-block: 1rem;
	}

}

/* =========================================================
bg
========================================================= */

.star_bg {
	background-color: #fff2e4;
	background-image: url("../img/bg.png");
	background-repeat: repeat-y;
	background-position: center top;
	background-size: 90%;
}

/* =========================================================
explain
========================================================= */

.explain {
	padding-block: 10rem;
	text-align: center;
}

.explain .inner {
	background: #fff;
	border-radius: 5rem;
	position: relative;
	padding: 6rem 0;
	box-shadow: 6px 6px 6px #e5b5c3;
}

.explain .inner .apitan {
	position: absolute;
	top: -3rem;
	left: 0;
	animation: moveA 6s ease-in-out infinite;
}

.explain .inner .piatan {
	position: absolute;
	bottom: -3rem;
	right: 0;
	animation: moveB 6s ease-in-out infinite;
}

@keyframes moveA {

	0%,
	50%,
	100% {
		transform: translate(0, 0);
	}

	12.5% {
		transform: translate(0, -2rem);
	}

	25% {
		transform: translate(0, 0);
	}

	37.5% {
		transform: translate(0, -3rem);
	}
}

@keyframes moveB {

	0%,
	50%,
	100% {
		transform: translate(0, 0);
	}

	62.5% {
		transform: translate(0, -2rem);
	}

	75% {
		transform: translate(0, 0);
	}

	87.5% {
		transform: translate(0, -3rem);
	}
}


.explain .txt_wrap {
	font-size: 3rem;
	font-weight: 700;
}

@media screen and (max-width: 1040px) {

	.explain .inner .apitan {
		top: -4rem;
	}

	.explain .inner .apitan img {
		max-width: 80px;
	}

	.explain .inner .piatan img {
		max-width: 82px;
	}
}

/* sp */
@media screen and (max-width: 767px) {

	.explain {
		padding-block: 6rem;
	}

	.explain .inner {
		border-radius: 3rem;
		padding: 3rem 0;
		box-shadow: 3px 3px 6px #e5b5c3;
	}

	.explain .inner .apitan {
		top: -3rem;
		left: 0;
	}

	.explain .inner .apitan img {
		max-width: 60px;
	}

	.explain .inner .piatan {
		bottom: -3rem;
		right: 0;
	}

	.explain .inner .piatan img {
		max-width: 62px;
	}

	.explain .txt_wrap {
		font-size: 2rem;
	}
}

/* =========================================================
black
========================================================= */

.black {
	padding-block: 10rem;
	text-align: center;
}

.black .inner {
	background: #e48188;
	border-radius: 5rem;
	padding: 6rem 2rem;
	box-shadow: 6px 6px 6px #e5b5c3;
}

.black h2+p {
	font-size: 2.6rem;
	margin-block: 2rem;
}

.black .gentei_wrap .sub {
	display: inline-block;
	font-size: 3rem;
	font-weight: 700;
	position: relative;
	margin-bottom: 3rem;
	background: #f7b612;
	padding: 2rem 4rem;
	border-radius: 5rem;
}

.black .gentei_wrap .sub::after {
	position: absolute;
	content: "";
	bottom: -2rem;
	left: 0;
	right: 0;
	margin-inline: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-right: 30px solid transparent;
	border-left: 30px solid transparent;
	border-top: 30px solid #f7b612;
	border-bottom: 0;
}

.black .gentei_wrap h3 {
	font-size: 3.6rem;
	font-weight: 700;
}

.black .gentei_wrap h3 span {
	font-size: 1.3em;
	color: #e50012;
}

.black .memo_wrap {
	text-align: initial;
	padding: 2rem;
	margin-block: 3rem;
	max-width: 1000px;
	margin: auto;
}

.black .memo_wrap li {
	font-size: 2.4rem;
}

/* sp */
@media screen and (max-width: 767px) {
	.black {
		padding-block: 5rem;
	}

	.black .inner {
		border-radius: 2.4rem;
		padding: 4rem 1.2rem;
		box-shadow: 3px 3px 6px #e5b5c3;
	}

	.black h2+p {
		font-size: 1.8rem;
		margin-block: 1.2rem;
	}

	.black .gentei_wrap .sub {
		font-size: 2rem;
		margin-bottom: 2rem;
		padding: 1rem 2rem;
		border-radius: 2.4rem;
	}

	.black .gentei_wrap .sub::after {
		bottom: -1.4rem;
		border-right: 14px solid transparent;
		border-left: 14px solid transparent;
		border-top: 14px solid #f7b612;
	}

	.black .gentei_wrap h3 {
		font-size: 2.2rem;
	}


	.black .memo_wrap {
		padding: 1rem;
		margin-block: 1.6rem;
		max-width: 96%;
	}

	.black .memo_wrap li {
		font-size: 1.6rem;
	}
}


/* =========================================================
oyako
========================================================= */

.oyako {
	padding-block: 10rem 16rem;
	text-align: center;
	position: relative;
}

.oyako .bg {
	position: absolute;
}

.oyako .bg01 {
	top: 40%;
	left: 10%;
}

.oyako .bg02 {
	top: 60%;
	right: 10%;
}

.oyako .bg03 {
	bottom: 20%;
	left: 10%;
}

.oyako .bg04 {
	bottom: 0.4%;
	left: 20%;
}

.oyako .bg05 {
	bottom: 0.4%;
	right: 20%;
}

.oyako .inner {
	background: #fffbda;
	border-radius: 5rem;
	box-shadow: 6px 6px 6px #e0d2b6;
}

.oyako .mv_wrap {
	background: url(../img/oyako_bg03.png) center / cover;
	padding: 5rem 2rem;
	border-radius: 5rem 5rem 0 0;
}

.oyako .mv_wrap p {
	padding-block: 2rem;
}

.oyako h3 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	font-size: 4.4rem;
	font-weight: 700;
	color: #33aa64;
}

.oyako h3+p {
	font-size: 3rem;
	margin: 3rem 0;
}

.oyako .txt_wrap {
	display: grid;
	grid-template-columns: 2.6fr 1fr;
	align-items: center;
	max-width: 900px;
	margin: 2rem auto;
	text-align: initial;
}

.oyako .txt_wrap .txt {
	font-size: 2.8rem;
}

.oyako .txt_wrap .txt span {
	font-size: 1.2em;
	color: #e50012;
}

.oyako .contents {
	max-width: 1000px;
	margin: auto;
	padding-block: 2rem 6rem;
}

.oyako .contents dl {
	padding-block: 2rem;
}

.oyako .contents dl:last-of-type {
	padding-bottom: 0;
}

.oyako dd {
	border-radius: 3rem;
	background: #fff;
	margin-block: 3rem;
	padding: 3rem 4rem;
	font-size: 2.4rem;
	text-align: initial;
	font-weight: 500;
}

.oyako dd.day {
	text-align: center;
}

.oyako dd .red {
	font-size: 1.2em;
	color: #e50012;
	font-weight: 700;
}

.oyako dd .small {
	font-size: 0.8em;
}

.oyako dd ul {
	padding: 2rem 0;
	font-size: 0.8em;
	color: #595757;
}

.oyako dd .memo_wrap {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 2rem;
	padding-block: 2rem;
}

@media screen and (max-width: 1040px) {
	.oyako .bg img {
		max-width: 80px;
	}

	.oyako .bg01 {
		top: 40%;
		left: 0;
	}

	.oyako .bg02 {
		top: 60%;
		right: 0;
	}

	.oyako .bg03 {
		bottom: 20%;
		left: 0;
	}

	.oyako .bg04 {
		bottom: 1.4%;
		left: 5%;
	}


	.oyako .bg04 img {
		max-width: 120px;
	}

	.oyako .bg05 {
		bottom: 1.4%;
		right: 5%;
	}

	.oyako .bg05 img {
		max-width: 120px;
	}

	.oyako .txt_wrap {
		max-width: 90%;
	}

	.oyako .txt_wrap .txt {
		font-size: 2.4rem;
	}

	.oyako .contents {
		max-width: 90%;
	}

}

/* sp */
@media screen and (max-width: 767px) {
	.oyako {
		padding-block: 6rem 8rem;
	}

	.oyako .bg img {
		max-width: 40px;
	}

	.oyako .bg01 {
		top: 36%;
		left: 0;
	}


	.oyako .bg04 img {
		max-width: 80px;
	}


	.oyako .bg05 img {
		max-width: 80px;
	}

	.oyako .inner {
		border-radius: 3rem;
		box-shadow: 3px 3px 6px #e0d2b6;
		padding: 0;
	}

	.oyako .mv_wrap {
		padding: 2.4rem 1.2rem;
		border-radius: 3rem 3rem 0 0;
	}

	.oyako .mv_wrap p {
		padding-block: 1.2rem;
	}

	.oyako h3 {
		font-size: 2.2rem;
	}

	.oyako h3 span img {
		max-width: 20px;
	}

	.oyako h3+p {
		font-size: 1.8rem;
		margin: 1.6rem 0;
	}

	.oyako .txt_wrap {
		grid-template-columns: 2.6fr 1fr;
		max-width: 96%;
		margin: 1.2rem auto;
	}

	.oyako .txt_wrap .txt {
		font-size: 1.6rem;
	}

	.oyako .contents {
		max-width: 96%;
		padding-block: 1.2rem 3rem;
		padding: 2rem 2rem 6rem;
	}

	.oyako .contents dl {
		padding-block: 1.2rem;
	}


	.oyako dd {
		border-radius: 1.6rem;
		margin-block: 1.6rem;
		padding: 1.6rem 2rem;
		font-size: 1.6rem;
	}


	.oyako dd ul {
		padding: 1.2rem 0;
	}

	.oyako dd .memo_wrap {
		grid-template-columns: 1fr;
		gap: 1.2rem;
		padding-block: 1.2rem;
	}
}

/* =========================================================
summarry
========================================================= */

.summary {
	padding-block: 10rem;
	text-align: center;
}

.summary .inner {
	background: #fff;
	border-radius: 5rem;
	position: relative;
	padding: 6rem 0;
	box-shadow: 6px 6px 6px #e5b5c3;
}

.summary .inner .piatan {
	position: absolute;
	top: -3rem;
	right: -2rem;
	animation: moveA 6s ease-in-out infinite;

}

.summary .inner .apitan {
	position: absolute;
	bottom: -3rem;
	left: -2rem;
	animation: moveB 6s ease-in-out infinite;
}

.summary h2 {
	color: #e48188;
	font-size: 4.2rem;
	font-weight: 700;
	line-height: 1.2;
	position: relative;
	padding: 2rem 9rem;
	display: inline-block;
}

.summary h2::before,
.summary h2::after {
	position: absolute;
	content: "";
	display: inline-block;
	background: url(../img/store_icon.png) center / cover;
	width: 80px;
	height: 76px;
}

.summary h2::before {
	top: 1rem;
	left: 0;
}

.summary h2::after {
	bottom: 1rem;
	right: 0;
}

.summary h2 .small {
	font-size: 0.7em;
}

.summary .contents {
	max-width: 1000px;
	margin: auto;
	padding-block: 2rem 6rem;
}

.summary .bnr_wrap {
	margin: 2rem auto;
	max-width: 900px;
}

.summary .bnr_wrap a {
	display: block;
	box-shadow: 8px 8px 6px #ccc;
	transition: transform 0.3s ease;
	will-change: transform;
}

.summary .bnr_wrap a:hover {
	opacity: 0.6;
}

@media screen and (max-width: 1040px) {

	.summary h2 {
		font-size: 3rem;
	}

	.summary .inner .piatan img {
		max-width: 82px;
	}

	.summary .inner .apitan img {
		max-width: 80px;
	}

	.summary .contents {
		max-width: 90%;
	}

	.summary .bnr_wrap {
		max-width: 90%;
	}

}

/* sp */
@media screen and (max-width: 767px) {
	.summary {
		padding-block: 5rem;
	}

	.summary .inner {
		border-radius: 3rem;
		padding: 3rem 0;
		box-shadow: 3px px 6px #e5b5c3;
	}

	.summary .inner .piatan {
		top: -3rem;
		right: 0;
	}

	.summary .inner .piatan img {
		max-width: 60px;
	}

	.summary .inner .apitan {
		bottom: -3rem;
		left: 0;
	}

	.summary .inner .apitan img {
		max-width: 62px;
	}

	.summary h2 {
		font-size: 2.2rem;
		padding: 1rem 3rem;
	}

	.summary h2::before,
	.summary h2::after {
		width: 36px;
		height: 34px;
	}

	.summary h2::before {
		top: -1rem;
		left: 0;
	}

	.summary h2::after {
		bottom: -1rem;
		right: 0;
	}

	.summary .contents {
		max-width: 96%;
		padding-block: 1.2rem 3rem;
	}

	.summary .bnr_wrap {
		margin: 1.2rem auto;
		max-width: 90%;
	}
}

/* =========================================================
ボタン
========================================================= */

.btn_wrap {
	max-width: 600px;
	margin: 3rem auto;
}

.btn_wrap a {
	width: 100%;
	display: inline-block;
	border-radius: 5rem;
	font-size: 3rem;
	padding: 2rem 4rem;
	position: relative;
}

.btn_wrap a .arrow {
	display: inline-block;
	position: absolute;
	top: 0;
	right: 2rem;
	bottom: 0;
	margin-block: auto;
	background: #fff;
	width: 60px;
	height: 60px;
	border-radius: 50%;
}

.btn_wrap a .arrow::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 2.4rem;
	margin-block: auto;
	content: "";
	transform: rotate(45deg);
	width: 20px;
	height: 20px;
	transition: all 0.2s;
}

.btn_wrap a:hover .arrow::after {
	right: 1.6rem;
}

.explain .btn_wrap a {
	background: #e48188;
	color: #fff;
}

.explain .btn_wrap a .arrow::after {
	border-right: 4px solid #e48188;
	border-top: 4px solid #e48188;

}

.oyako .btn_wrap a {
	text-align: center;
	background: #33aa64;
	color: #fff;
}

.oyako .btn_wrap a .arrow::after {
	border-right: 4px solid #33aa64;
	border-top: 4px solid #33aa64;
}

.btn_wrap a.soon {
	background: #ccc;
	pointer-events: none;
	cursor: default;
}

.btn_wrap a.soon .arrow {
	display: none;
}

.btn_wrap a.soon .arrow::after {
	display: none;
}

/* sp */
@media screen and (max-width: 767px) {

	.btn_wrap {
		max-width: 80%;
		margin: 1.6rem auto;
	}

	.btn_wrap a {
		border-radius: 2.4rem;
		font-size: 1.8rem;
		padding: 1rem 2rem;
	}

	.btn_wrap a .arrow {
		right: 1rem;
		width: 30px;
		height: 30px;
	}

	.btn_wrap a .arrow::after {
		right: 1.2rem;
		margin-block: auto;
		width: 8px;
		height: 8px;
	}

	.btn_wrap a:hover .arrow::after {
		right: 0.6rem;
	}

	.explain .btn_wrap a .arrow::after {
		border-right: 2px solid #e48188;
		border-top: 2px solid #e48188;

	}


	.oyako .btn_wrap a .arrow::after {
		border-right: 2px solid #33aa64;
		border-top: 2px solid #33aa64;
	}
}


/* =========================================================
タイトルリボン
========================================================= */

.ttl_wrap {
	position: relative;
	text-align: center;
	padding: 1rem 0;
	color: #FFF;
	margin-bottom: 3rem;
}

.ttl_wrap h3,
.ttl_wrap dt {
	font-size: 2.8rem;
	margin: 0;
	padding: 1rem 3rem;
	border-top: dashed 2px #fff;
	border-bottom: dashed 2px #fff;
	font-weight: 700;
}

.ttl_wrap::before,
.ttl_wrap::after {
	position: absolute;
	content: "";
	width: 0px;
	height: 0px;
	z-index: 1;
}

.ttl_wrap::before {
	top: 0;
	left: 0;
	border-width: 42px 0px 42px 20px;
	border-style: solid;
}

.ttl_wrap::after {
	top: 0;
	right: 0;
	border-width: 42px 20px 42px 0px;
	border-style: solid;
}

/* 詳細設定 */

.black .shop_wrap .ttl_wrap {
	background: #f7b612;
}

.black .shop_wrap .ttl_wrap::before {
	border-color: transparent transparent transparent #e48188;
}

.black .shop_wrap .ttl_wrap::after {
	border-color: transparent #e48188 transparent transparent;
}

.oyako .ttl_wrap {
	background: #f08300;
}

.oyako .ttl_wrap::before {
	border-color: transparent transparent transparent #fffbda;
}

.oyako .ttl_wrap::after {
	border-color: transparent #fffbda transparent transparent;
}

.summary .ttl_wrap {
	background: #e48188;
}

.summary .ttl_wrap::before {
	border-color: transparent transparent transparent #fff;
}

.summary .ttl_wrap::after {
	border-color: transparent #fff transparent transparent;
}

@media screen and (max-width: 1040px) {

	.ttl_wrap h3,
	.ttl_wrap dt {
		font-size: 2.4rem;
	}

}


/* sp */
@media screen and (max-width: 767px) {
	.ttl_wrap {
		padding: 0.6rem 0;
		color: #FFF;
		margin-bottom: 1.6rem;
	}

	.ttl_wrap h3,
	.ttl_wrap dt {
		font-size: 1.8rem;
		padding: 0.6rem 2rem;
		border-top: dashed 1px #fff;
		border-bottom: dashed 1px #fff;
	}


	.ttl_wrap::before {
		border-width: 28px 0px 28px 10px;
	}

	.ttl_wrap::after {
		border-width: 28px 10px 28px 0px;
	}

}

/* =========================================================
店舗一覧
========================================================= */
.shop_wrap {
	max-width: 1000px;
	margin: 2rem auto;
}

.shop_wrap .area-wrap {
	margin: 2rem auto;
	border-radius: 3rem;
	padding: 0.6rem 0;
}

.shop_wrap .area-wrap+.area-wrap {
	margin-top: 3rem;
}

.shop_wrap .title {
	font-size: 2.4rem;
	position: relative;
	padding: 1rem;
}

.shop_wrap .title::before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 0;
	right: 1rem;
	bottom: 0;
	margin-block: auto;
	width: 40px;
	height: 40px;
	border-radius: 50%;
}

.shop_wrap .title::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 2.2rem;
	margin-block: auto;
	content: "";
	transform: rotate(45deg);
	width: 14px;
	height: 14px;
	border-right: 3px solid #fff;
	border-top: 3px solid #fff;
	transition: all .5s ease;
}

/*　closeというクラスがついたら形状変化　*/
.shop_wrap .title.close::after {
	transform: rotate(135deg);
}

/*アコーディオン内*/
.shop_wrap .box {
	display: none;
	/*はじめは非表示*/
	margin-bottom: 3rem;
	padding: 3rem 0;
}

.shop_wrap .box ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 3rem;
	padding: 1rem 2rem;
}

.shop_wrap .box li {
	padding: 2rem;
	font-size: 2rem;
	transition: transform 0.3s ease;
	will-change: transform;
}

.shop_wrap .box li:hover {
	transform: scale(1.04);
}

.black .shop_wrap .box li a {
	font-weight: 500;
}

.shop_wrap .box li a span {
	font-size: 0.9em;
}

/* 詳細設定 */

.black .shop_wrap .area-wrap {
	background: #fff2e4;
}

.black .shop_wrap .title::before {
	background: #f7b612;
}

.black .shop_wrap .box {
	border-top: 2px dashed #f7b612;
}

.black .shop_wrap .box li {
	background: #f7b612;
}

.black .shop_wrap .box li a {
	color: #fff;
}

.summary .shop_wrap .area-wrap {
	background: #fff2e4;
}

.summary .shop_wrap .title::before {
	background: #e48188;
}

.summary .shop_wrap .box {
	border-top: 2px dashed #e48188;
}

.summary .shop_wrap .box li {
	background: #e48188;
}

.summary .shop_wrap .box li a {
	color: #fff;
}

/* sp */
@media screen and (max-width: 767px) {
	.shop_wrap {
		max-width: 96%;
		margin: 1.2rem auto;
	}

	.shop_wrap .area-wrap {
		margin: 1.2rem auto;
		border-radius: 1.4rem;
		padding: 0.2rem 0;
	}

	.shop_wrap .area-wrap+.area-wrap {
		margin-top: 1.6rem;
	}

	.shop_wrap .title {
		font-size: 1.6rem;
		padding: 0.6rem;
	}

	.shop_wrap .title::before {
		right: 0.6rem;
		width: 20px;
		height: 20px;
	}

	.shop_wrap .title::after {
		right: 1.3rem;
		width: 6px;
		height: 6px;
		border-right: 2px solid #fff;
		border-top: 2px solid #fff;
	}


	/*アコーディオン内*/
	.shop_wrap .box {
		margin-bottom: 2rem;
		padding: 1.4rem 0;
	}

	.shop_wrap .box ul {
		grid-template-columns: 1fr 1fr;
		gap: 1.6rem;
		padding: 0.4rem 1rem;
	}

	.shop_wrap .box li {
		padding: 1.2rem;
		font-size: 1.4rem;
	}


	/* 詳細設定 */

	.black .shop_wrap .box {
		border-top: 1px dashed #f7b612;
	}

	.summary .shop_wrap .box {
		border-top: 1px dashed #e48188;
	}

}


/* =========================================================
ページトップ リンク
========================================================= */

/*リンクの形状*/
#page-top a {
	font-weight: 700;
	padding: 1rem;
	display: flex;
	background: #e48188;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	width: 100px;
	height: 100px;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.4rem;
	font-weight: bold;
	border: 2px solid #333;
	transition: all 0.3s;
	border-radius: 50%;
	box-sizing: border-box;
}

#page-top a span {
	display: block;
	width: 100%;
	line-height: 1.2;
}

#page-top a img {
	width: auto;
	max-width: 80%;
}

#page-top a:hover {
	animation: ptMove 1.2s linear;
}

@keyframes ptMove {
	0% {
		transform: translate(0);
	}

	25% {
		transform: translate(0, -2rem);
	}

	50% {
		transform: translate(0, 0);
	}

	75% {
		transform: translate(0, -3rem);
	}

	100% {
		transform: translate(0);
	}
}


/*リンクを右下に固定*/
#page-top {
	position: fixed;
	right: 10px;
	bottom: 20px;
	z-index: 99999;
	/*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove {
	animation: UpAnime 0.5s forwards;
	bottom: 30px;
}

@keyframes UpAnime {
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/*　下に下がる動き　*/

#page-top.DownMove {
	animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
	from {
		opacity: 1;
		transform: translateY(0);
	}

	to {
		opacity: 1;
		transform: translateY(100px);
	}
}


@media screen and (max-width: 767px) {

	#page-top {
		bottom: 20px;
	}

	#page-top.UpMove {
		bottom: 30px;
	}

	#page-top a {
		padding: 0.8rem 0;
		width: 60px;
		height: 60px;
		font-size: 1rem;
		border: 1px solid #333;
	}

	#page-top a img {
		max-width: 60%;
	}

}

/*---------------------------------------------
フッター
---------------------------------------------*/

footer {
	width: 100%;
	padding: 2rem 0;
	text-align: center;
	color: #333;
	background: #fff2e4;
}

footer a {
	color: #333;
	text-decoration: none;
}

/* sp */
@media screen and (max-width: 520px) {
	footer {
		padding: 10px 0;
	}

	footer a {
		font-size: 0.5em;
	}

	#page-top a {
		margin: 0 -10px 0 0;
	}
}