@charset "utf-8";

footer{ display:none;}

@media screen and (max-width: 739px) {
footer{ display: block; margin-top:40px;}
ul#bottom-btn{
	overflow:hidden;
	display: flex;
	text-align: center;
	text-decoration: none;
	font-size:.8rem;
	transition:all 0.3s;
	width:100%;
	}
ul#bottom-btn li{
	float:left;
	overflow:hidden;
	display:block;
	background-color:#666;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	}	
ul#bottom-btn li.tel{
	background-color: #0E0067;
	width: 43%!important;
	}
ul#bottom-btn li.access{
	background-color: #00507E;
	width: 43%!important;
	}
ul#bottom-btn li.pagetop{
	background-color: #4BA2D9;
	width: 14%!important;
	}
ul#bottom-btn li a p {margin:12px 0;}	
	
ul#bottom-btn li a{
	color: #fff;
	text-decoration:none;
	}
	
ul#bottom-btn li:hover.tel{background-color: #090048;}
ul#bottom-btn li:hover.access{background-color:#090048;}
ul#bottom-btn li:hover.pagetop{background-color:#090048;}
ul#bottom-btn li:hover p{color: #FF9;}

ul#bottom-btn li a p {margin:16px 0;}	
ul#bottom-btn li a p span{vertical-align: -6px; padding-right:3px;}	

ul#bottom-btn {
	position: fixed;
	left: 0px;
	bottom:0px;
	z-index: 2;
	opacity: 0;
	transform: translateY(100px);
}

ul#bottom-btn.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

ul#bottom-btn.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}

#footer-btn{
	position: relative;
	z-index: 2;
}

	}
