@charset "UTF-8";
/* 共通 */
/*
ハンバーガーメニュー、アクセス文言追加_テキスト色設定
-----------------------------------------------*/
@media screen and (max-width:768px) {
	.sp_menu_wrap .sp_access_btn a { color: #55ADEA; }
	.sp_menu_wrap .sp_menu_btn div { color: #55ADEA; }
}

.akka { color: #ff0000 !important; }

/* Button_CSS */
#mosiko a {
	display: block;
	margin: 2em auto 4em auto;
	padding: 49px 0;
	font-size: 29px;

	box-shadow: 0px 10px 0px 0px #cb0051;
}
#mosiko a {
	width:55%;
	max-width: 820px;
	background-color: #ff418d;
	border-radius: 10px;
	text-align: center;
	color: #fff;
	font-weight: bolder;

	padding: 50px;
	/* text-align: center; */
	font-size: 26px;
	margin: 0 auto;
}
#mosiko a:hover {
	transition: background-color 0.1s;
	-webkit-transform: translate3d(0px, 5px, 0);
	transform: translate3d(0px, 5px, 0);
	box-shadow: 0px 5px 0px 0px #cb0051 !important;
}
/* Green */
#mosiko.bg_green {}
#mosiko.bg_green a {
box-shadow: 0px 10px 0px 0px #1f9005;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #01b701), color-stop(0, #249509));
background: -webkit-linear-gradient(top, #249509 0%, #01b701 100%);
background: -moz-linear-gradient(top, #249509 0%, #01b701 100%);
background: -ms-linear-gradient(top, #249509 0%, #01b701 100%);
background: linear-gradient(to bottom, #249509 0%, #01b701 100%);
}
#mosiko.bg_green a:hover {
	transition: background-color 0.1s;
	-webkit-transform: translate3d(0px, 5px, 0);
	transform: translate3d(0px, 5px, 0);
	box-shadow: 0px 5px 0px 0px #1f9005 !important;
}

/*Orange*/
#mosiko.bg_orange a {
  box-shadow: 0px 10px 0px 0px #de501f;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #ff8330), color-stop(0, #e65a2b));
  background: -webkit-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: -moz-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: -ms-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: linear-gradient(to bottom, #e65a2b 0%, #ff8330 100%);
}
#mosiko.bg_orange a:hover {
	box-shadow: 0px 5px 0px 0px #de501f !important;
}

/*Blue*/
#mosiko.bg_blue a {
  box-shadow: 0px 10px 0px 0px #035a8c;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #0ec3ff), color-stop(0, #0a86e6));
  background: -webkit-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: -moz-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: -ms-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: linear-gradient(to bottom, #0a86e6 0%, #0ec3ff 100%);
}
#mosiko.bg_blue a:hover {
	box-shadow: 0px 5px 0px 0px #035a8c !important;
}

@media screen and (max-width:768px) {
	#mosiko a {
		padding: 25px 0;
		font-size: 19px;
		width: 90%;
	}
}

/*
申し込み id_2
----------------------------------*/
#mosiko2 a {
	display: block;
	margin: 2em auto 4em auto;
	padding: 49px 0;
	font-size: 29px;

	box-shadow: 0px 10px 0px 0px #cb0051;
}
#mosiko2 a {
	width:55%;
	max-width: 820px;
	background-color: #ff418d;
	border-radius: 10px;
	text-align: center;
	color: #fff;
	font-weight: bolder;

	padding: 50px;
	/* text-align: center; */
	font-size: 26px;
	margin: 0 auto;
}
#mosiko2 a:hover {
	transition: background-color 0.1s;
	-webkit-transform: translate3d(0px, 5px, 0);
	transform: translate3d(0px, 5px, 0);
	box-shadow: 0px 5px 0px 0px #cb0051 !important;
}
/* Green */
#mosiko2.bg_green {}
#mosiko2.bg_green a {
box-shadow: 0px 10px 0px 0px #1f9005;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #01b701), color-stop(0, #249509));
background: -webkit-linear-gradient(top, #249509 0%, #01b701 100%);
background: -moz-linear-gradient(top, #249509 0%, #01b701 100%);
background: -ms-linear-gradient(top, #249509 0%, #01b701 100%);
background: linear-gradient(to bottom, #249509 0%, #01b701 100%);
}
#mosiko2.bg_green a:hover {
	transition: background-color 0.1s;
	-webkit-transform: translate3d(0px, 5px, 0);
	transform: translate3d(0px, 5px, 0);
	box-shadow: 0px 5px 0px 0px #1f9005 !important;
}

/*Orange*/
#mosiko2.bg_orange a {
  box-shadow: 0px 10px 0px 0px #de501f;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #ff8330), color-stop(0, #e65a2b));
  background: -webkit-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: -moz-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: -ms-linear-gradient(top, #e65a2b 0%, #ff8330 100%);
  background: linear-gradient(to bottom, #e65a2b 0%, #ff8330 100%);
}
#mosiko2.bg_orange a:hover {
	box-shadow: 0px 5px 0px 0px #de501f !important;
}

/*Blue*/
#mosiko2.bg_blue a {
  box-shadow: 0px 10px 0px 0px #035a8c;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #0ec3ff), color-stop(0, #0a86e6));
  background: -webkit-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: -moz-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: -ms-linear-gradient(top, #0a86e6 0%, #0ec3ff 100%);
  background: linear-gradient(to bottom, #0a86e6 0%, #0ec3ff 100%);
}
#mosiko2.bg_blue a:hover {
	box-shadow: 0px 5px 0px 0px #035a8c !important;
}

@media screen and (max-width:768px) {
	#mosiko2 a {
		padding: 25px 0;
		font-size: 19px;
		width: 90%;
	}
}

/*
ani
----------------------------------*/
.ani {
	transition: 1s all;
	opacity: 0;
	position: relative;
	top: 300px;
}
.ani.move {
	animation: up3 1s;
	animation-fill-mode: forwards;
	opacity: 1;
	top: 0;
}
.ani2 {
	top: 0;
}
.ani2.move {
	animation: fade 2s;
	animation-fill-mode: forwards;
}

@keyframes up {
	0% {
		opacity: 0;
		transform: translateY(0);
	}
	100% {
		opacity: 1;
		transform: translateY(30%);
	}
}
@keyframes up2 {
	80% {
		opacity: 0;
		transform: translateY(0) rotate(10deg);
	}
	100% {
		opacity: 1;
		transform: translateY(100%) rotate(-8deg);
	}
}

@keyframes up3 {
	0% {
		opacity: 0;
		transform: translateY(20%);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
/*
@keyframes poyoyon2 {
	0% {
		transform: scale(0.5, 0.5) translate(0, 0);
	}
	15% {
		transform: scale(0.98, 0.9) translate(0, 5px);
	}
	30% {
		transform: scale(1.02, 1.0) translate(0, 8px);
	}
	50% {
		transform: scale(0.98, 1.05) translate(0, -8px);
	}
	70% {
		transform: scale(1.0, 0.9) translate(0, 5px);
	}
	100% {
		transform: scale(1.0, 1.0) translate(0, 0);
	}
	0%, 100% {
		opacity: 1;
	}
}
*/
@keyframes fade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
/*
共通 / End
------------------------------------------------*/