@charset "utf-8";

/* index.html
----------------- */
.index .lead {
	font-size: 2rem;
	text-align: center;
}
.index .shoplist {
	margin-top: 3.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 2rem 2%;
}
.index .shoplist a {
	padding: 0.5rem 3rem;
	width: 32%;
	min-height: 6rem;
	border: 1px solid #e4007f;
	font-size: 2rem;
	color: #040000;
	text-align: center;
	line-height: 1.3;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}
.index .shoplist a::before {
	content: '';
	border-top: solid 2px #e4007f;
	border-right: solid 2px #e4007f;
	width: 1.2rem;
	height: 1.2rem;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 0.6rem);
	right: 5.5%;
}
.index .other {
	margin-top: 2rem;
	padding: 1.5rem;
	border: 1px solid #e4007f;
	font-size: 2rem;
	line-height: 1;
	text-align: center;
}
.index .other .otherTtl {
	color: #e4007f;
	font-weight: bold;
}
.index .other ul {
	margin-top: 1.5rem;
}
.index .other ul li + li {
	margin-top: 1rem;
}
.index .other ul li span {
	display: inline-block;
	padding: 0 2rem;
}
.index .note {
	margin-top: 1.5rem;
	text-align: center;
}
.index .news {
	margin-top: 8rem;
	padding: 2.5rem 3.5rem;
	border: 3px solid #f00;
	font-size: 2rem;
}
.index .news .newsTtl {
	margin-bottom: 1rem;
	font-weight: bold;
}
@media (max-width: 768px) {
	.index .inner {
		padding: 0 4rem;
	}
	main.bg.index .mainTtl h1 {
		font-size: 4.4rem;
	}
	.index .lead {
		font-size: 2.7rem;
	}
	.index .shoplist {
		margin-top: 2.5rem;
		gap: 2.5rem 4%;
	}
	.index .shoplist a {
		padding: 1rem 2.8rem;
		width: 48%;
		min-height: 8.4rem;
		font-size: 2.8rem;
	}
	.index .shoplist a::before {
		width: 2.4rem;
		height: 2.4rem;
		top: calc(50% - 1.2rem);
		right: 3.5%;
	}
	.index .other {
		padding: 3rem;
		font-size: 2.7rem;
		line-height: 1.5;
	}
	.index .other ul {
		margin-top: 2.4rem;
		text-align: left;
	}
	.index .other ul li + li {
		margin-top: 0;
	}
	.index .other ul li span {
		display: block;
		padding: 0;
	}
	.index .note {
		font-size: 2.4rem;
		text-align: left;
	}
	.index .news {
		font-size: 2.7rem;
	}
}


/* shop.html
----------------- */
main.bg.shop .mainTtl h1 {
	line-height: 1.2;
}

/* tbl */
.shop .tbl {
	margin-top: 3rem;
	width: 100%;
	font-size: 2rem;
	border: 1px solid #000;
	display: table;
	line-height: 1;
}
.shop .tbl .top {
	border-bottom: 1px solid #000;
}
.shop .tbl .top > th {
	padding: 1rem 0;
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
}
.shop .tbl .blue > th,
.shop .tbl .gray > th {
	height: 11.4rem;
	padding: 3rem;
}
.shop .tbl .blue > td,
.shop .tbl .gray > td {
	padding: 3rem;
	height: 17.4rem;
	color: #4B4B4B;
	line-height: 1.5;
}
.shop .tbl .blue > th {
	background-color: #2c92cc;
	color: #fff;
	text-align: center;
	font-weight: bold;
	width: 20%;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	display: table-cell;
	vertical-align: middle;
}
.shop .tbl .blue > td {
	background-color: #d6eaf5;
	border-bottom: 1px solid #000;
	display: table-cell;
	vertical-align: middle;
	width: 80%
}
.shop .tbl .blue > td span {
	font-weight: bold;
}
.shop .tbl .blue > td ul li {
	font-weight: bold;
	padding-left: 1em;
	text-indent: -1em;
}
.shop .tbl .blue > td ul .indent {
	padding-left: 2.5em;
	text-indent: -2.5em;
}
.shop .tbl .gray > th {
	background-color: #d2d0cf;
	text-align: center;
	border-right: 1px solid #000;
	display: table-cell;
	vertical-align: middle;
	width: 20%;
}
.shop .tbl .gray > td {
	background-color: #e7e6e5;
	display: table-cell;
	vertical-align: middle;
	width: 80%;
}
.shop .tbl .gray > td .mg {
	display: inline-block;
	margin-bottom: 1.25rem;
}
.shop .tbl .gray > td ul {
	display: flex;
	flex-wrap: wrap;
}
.shop .tbl .gray > td ul li {
	flex: 0 1 35%;
}
.shop .tbl .gray > td .wide li {
	flex: 0 1 40%;
}
.shop .tbl .gray > td ul .wide {
	flex: 0 1 44%;
}
.shop .tbl .gray > td ul .wide02 {
	flex: 0 1 55%;
}

/* note */
.shop .note {
	font-size: 1.5rem;
	margin-top: 3rem;
	text-align: center;
}
.shop .btn01 {
	margin: 0 auto;
	text-align: center;
}
.shop .btn01 a {
	display: inline-block;
	padding: 0.5rem 2.5rem 0.5rem 1rem;
	border: 1px solid #e4007f;
	font-size: 2.2rem;
	font-weight: bold;
	color: #e4007f;
	position: relative;
}
.shop .btn01 a::before {
	content: '';
	border-top: solid 2px #e4007f;
	border-right: solid 2px #e4007f;
	width: 1.2rem;
	height: 1.2rem;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 0.6rem);
	right: 1rem;
}
.shop .btn01 a.sp {
	display: none;
}
.shop .btn02 {
	margin: 3rem auto 0;
	width: 29rem;
	font-size: 2.2rem;
	font-weight: bold;
	color: #fff;
	background-color: #e4007f;
	border-radius: 3rem;
}
.shop .btn02 a {
	display: block;
	padding: 0.5rem 0 0.3rem 2rem;
	text-align: center;
	color: #fff;
	position: relative;
}
.shop .btn02 a::before {
	content: '';
	border-bottom: solid 2px #fff;
	border-left: solid 2px #fff;
	width: 1.2rem;
	height: 1.2rem;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 0.6rem);
	left: 6.5%;
}
@media (max-width: 768px) {
	.shop .inner {
		padding: 0 4rem;
	}
	main.bg.shop .mainTtl h1 {
		font-size: 4.4rem;
	}
	
	/* tbl */
	.shop .tbl {
		font-size: 2.8rem;
		line-height: 1.4;
	}
	.shop .tbl .top > th {
		padding: 0.8rem 0;
		font-size: 2.8rem;
	}
	.shop .tbl .blue > td,
	.shop .tbl .gray > td {
		line-height: 1.4;
	}
	.shop .tbl .blue > th {
		padding: 0;
		height: auto;
	}
	.shop .tbl .blue > td {
		padding: 4rem 2rem;
		height: auto;
	}
	.shop .tbl .gray > th {
		padding: 0;
		height: auto;
	}
	.shop .tbl .gray > td {
		padding: 2.5rem 2rem;
		height: auto;
	}
	.shop .tbl .gray > td .mg {
		margin-bottom: 2.5rem;
	}
	.shop .tbl .gray > td ul {
		flex-direction: column;
	}
	.shop .tbl .gray > td ul li {
		flex: 0 1 auto;
	}
	.shop .tbl .gray > td .wide li {
		flex: 0 1 auto;
	}
	.shop .tbl .gray > td ul .wide {
		flex: 0 1 auto;
	}
	.shop .tbl .gray > td ul .wide02 {
		flex: 0 1 auto;
	}

	/* note */
	.shop .note {
		font-size: 2.4rem;
		text-align: left;
	}
	.shop .btn01 a {
		padding: 1rem 4rem 1rem 1rem;
		font-size: 2.8rem;
	}
	.shop .btn01 a::before {
		border-top: solid 1px #e4007f;
		border-right: solid 1px #e4007f;
		width: 2rem;
		height: 2rem;
		top: calc(50% - 1rem);
		right: 1.5rem;
	}
	.shop .btn01 a.sp {
		display: inline-block;
	}
	.shop .btn01 a.pc {
		display: none;
	}
	.shop .btn02 {
		width: 37rem;
		font-size: 2.8rem;
	}
	.shop .btn02 a {
		padding: 1rem 0 0.8rem 1.4rem;
	}
	.shop .btn02 a::before {
		border-bottom: solid 1px #fff;
		border-left: solid 1px #fff;
		width: 2rem;
		height: 2rem;
		top: calc(50% - 1rem);
		left: 5.5%;
	}
}