@charset "utf-8";

/**--- 常時ナビ ---**/
.floatingNav {
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 998;
}

.floatingNav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.floatingNav .pcno {
	display: none;
}

.floatingNav li a {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: .5em 0;
	padding: .8em;
	color: #fff;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	writing-mode: vertical-rl;
	text-orientation: upright;
	background: linear-gradient(to bottom, #638ec1, #396099);
	border-radius: 10px 0 0 10px;
	box-shadow: -2px 0 4px #ccc;
}

.floatingNav li:nth-child(2) a {
	background: linear-gradient(to bottom, #f6a760, #ec8526);
}

.floatingNav li:nth-child(3) a {
	color: #43654d;
	background: linear-gradient(to bottom, #f2f7eb, #d3e4ba);
}

.floatingNav li:nth-child(4) a {
	background: linear-gradient(to bottom, #b2c5be, #86a29a);
}

.floatingNav li a img {
	margin-bottom: .5em;
}

@media only screen and (max-width:767px) {
	footer {
		margin-bottom: 4.3em;
	}

	.pagetop {
		bottom: 80px;
	}

	.floatingNav {
		width: 100%;
		top: auto;
		bottom: 0;
		transform: none;
	}

	.floatingNav ul {
		display: flex;
		justify-content: space-between;
		gap: 1px;
	}

	.floatingNav li {
		width: calc(100% / 4);
	}

	.floatingNav .pcno {
		display: block;
	}

	.floatingNav li a {
		flex-wrap: wrap;
		flex-direction: column;
		width: 100%;
		margin: 0;
		padding: .5em;
		writing-mode: inherit;
		text-orientation: inherit;
		border-radius: 0;
		box-shadow: none;
	}

	.floatingNav li a img {
		width: 25px;
		height: auto;
	}
}