@charset "utf-8";

/*サイト共通パーツ設定*/

.animation {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all .3s;
	transition: all .3s;
}

.animation:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05);
	-webkit-transition: all .3s;
	transition: all .3s;
}



/*緑のボタン*/
.bt_01 {
	border-width: 1px;
	-moz-border-radius: 1%;
	-webkit-border-radius: 0%/3%;
	border-radius: 0%/3%;
	border-style: solid;
	-moz-box-shadow: 2px 2px 0px rgb(0, 174, 193);
	-webkit-box-shadow: 2px 2px 0px rgb(0, 174, 193);
	box-shadow: 2px 2px 0px rgb(0, 174, 193);
	transition: 0.5s;
	display: block;
	border-color: rgb(0, 174, 193);
	background-color: rgb(255, 255, 255);
	color: #00AEC1 !important;
	padding: 18px 90px;
	text-align: center;
}

.bt_01:hover {
	background-color: #00AEC1;
	color: #FFF !important;
}

/* SP用 */
@media screen and (max-width: 740px) {
	.bt_01 {
		padding: 18px;
		text-align: center;
	}
}


.p-btn-column {
	display: none;
	position: fixed;
	bottom: 250px;
	right: 0;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-size: 20px;
	font-weight: bold;

	background: #01a7e5;
	color: #FFF !important;
	padding: 2em .5em 1.5em .5em;
	border-radius: 8px 0 0 8px;

	z-index: 5;
	transition: background 0.3s, color 0.3s, transform 0.3s;

}

.p-btn-column {
	opacity: 0;
	transform: translateY(30px);
	animation: fadeInUp 1s ease-out 0.3s forwards;
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(-30px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.p-btn-column:hover {
	background: #008fc1;
	color: #fff !important;
	transform: translateY(0) scale(1.15);
}

@media (min-width: 980px) {
	.p-btn-column {
		display: block;
	}
}